passing list with form.serialize

Question

This is my javascript function to pass data from view to controller:

 function UpdateCourse() {
    debugger
    SelectedIncharge();
    SelectedAssistants();
    SelectedParticipants();
    var Course = $("form").serialize();
    var model = {
        courseData: Course,
        SelectedInchargeList: SelectedInchargeList,
        SelectedAssistantList: SelectedAssistantList,
        SelectedParticipantList: SelectedParticipantList           
    };
    debugger
    $.ajax({
        url: '@Url.Action("UpdateCourseDetails", "Course")',
        type: 'POST',
        dataType: 'JSON',
        data: model,
       // contentType: "application/json",
        success: function (data) {
            $('#CoursesSaveBtn').prop("disabled", false);
            ShowStatus(data.Response);
            hideWait();
            GetCourseGrid();
        },
        error: function (xhr) {
            $('#CoursesSaveBtn').prop("disabled", false);
            var response = { "ResponseCode": 99, "ResponseMessage": "Validation Failed" };
            var responseCode = JSON.parse(JSON.stringify(response));
            ShowStatus(responseCode);
            hideWait();
        }
    });
}

I am getting values in the model variable but i get only list correctly the courseData remains null. Here is my code of the view model.

public class CourseModel
{
    //public Guid Id { get; set; }
    //public string Name { get; set; }
    //public string Description { get; set; }
    //public string ClassRoom { get; set; }
    //public DatabaseOperationType Operation { get; set; }
    public CourseRequestDto courseData { get; set; }
    public List<Guid> SelectedInchargeList { get; set; }
    public List<Guid> SelectedAssistantList { get; set; }
    public List<Guid> SelectedParticipantList { get; set; }
}

And my controller definition is as follows:

   [HttpPost]
    public ActionResult UpdateCourseDetails(CourseModel model)
    {
    }

`var Course = $("form").serialize();` serializes your form (creates a query string). You cant then create another object containing that data. If you have generated you view correctly then `.serialize()` is all you need to send all the data including for your collections. And you have not even told us what your variables for `SelectedInchargeList` etc are. — , Nov 06 '17 at 08:07

score 0 · Accepted Answer · answered Nov 06 '17 at 07:55

$("form").serialize() returns a string with serialized values, like key1=value1&key2=value2. Your model expects CourseRequestDto, so there is probably an error while mapping a string instead of json.

My guess is that your courseData needs to be in json format. You can refer to this answer to get the form data: Convert form data to JavaScript object with jQuery

passing list with form.serialize

1 Answers1