JQuery пост массив, вызывающий зависание браузера - MVC 3

Question

У меня есть массив JS из следующих объектов:

function SkillModel(skillModelAdapter) {
    this.SkillId = skillModelAdapter.SkillId;
    this.SkillName = skillModelAdapter.SkillName;
    this.Proficiency = skillModelAdapter.Proficiency;

    this.Element = null;

    this.ProficiencyString = function () {
        switch (this.Proficiency) {
            case 1:
                return "Beginner";
            case 2:
                return "Novice";
            case 3:
                return "Intermediate";
            case 4:
                return "Advanced";
            default:
                return "Expert";
        }
    };

    this.CreateElement = function () {
        var searchSkill = $('<div>').addClass('searchSkill').attr('skillId', this.SkillId);
        var skillName = $('<span>').addClass('skillName').html(this.SkillName);
        var proficiency = $('<span>').attr('proficiency', this.Proficiency).html(' (' + this.ProficiencyString() + ')');
        var removeLink = $('<a href="#">').addClass('removeSkill').html('X');

        searchSkill.append(skillName);
        searchSkill.append(proficiency);
        searchSkill.append(removeLink);

        this.Element = searchSkill;

        $('#SkillsContainer').append(searchSkill);
    };
}

Когда массив публикуется на моем контроллере MVC, он работает нормально, если массив пуст.Если в массиве есть объект, он падает.

Есть ли проблема, потому что мой объект json содержит функции?

Приветствия,

Джеймс

Answer 1

Функции не могут быть сериализованы JSON.Вы не должны пытаться сериализовать такой объект.Из вашего кода похоже, что вы уже передаете некоторый объект skillModelAdapter в конструктор SkillModel, который выглядит хорошим кандидатом для сериализации JSON:

Например:

var skillModelAdapters = [
    { SkillId: 1, SkillName: 'skill 1', Proficiency: 1 },
    { SkillId: 2, SkillName: 'skill 2', Proficiency: 1 },
    { SkillId: 3, SkillName: 'skill 3', Proficiency: 3 },
    { SkillId: 4, SkillName: 'skill 4', Proficiency: 2 }
];

итогда:

$.ajax({
    url: '@Url.Action("SomeAction")',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify(skillModelAdapters),
    success: function(result) {

    }
});

и на стороне сервера у вас будет модель вида:

public class SkillViewModel
{
    public int SkillId { get; set; }
    public string SkillName { get; set; }
    public int Proficiency { get; set; }
}

и соответствующее действие контроллера:

[HttpPost]
public ActionResult SomeAction(IEnumerable<SkillViewModel> skills)
{
    ...
}