List not passed properly via ajax to Controller Action in MVC 4

Question

I pass a List(data) along with an ID(id) through ajax to the MVC Action(EditDesignTemplate).

I get the count of the parameter data list as 0 in my EditDesignTemplate Action while I can see that the parameter id has captured the value properly from the ajax.

But I could get the values stored in the data variable in jquery if I alert it, so obviously the list is not passing as empty parameter. Also the parameters are visible in the below given error url.

jQuery:

            var $trows = $('#ContentPlaceHolder1_FrmView_rptcreation_grdtstrpt').find('tr:has(td)');
            var data = [];
            var report_kid = $('#report_kid').val();
            for (var i = 0; i < $trows.length; i++)
            {
                var $tds = $($trows).eq(i).children('td');
                data.push({ 'id': $tds.eq(0).text(), 'text': $tds.eq(1).text() });
                //alert($tds.eq(1).text());
            }

            $.ajax({
                url: "http://localhost:3916/FormsCreation/EditDesignTemplate/",
                type: 'GET',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: {data:JSON.stringify(data), id:escape(report_kid)},
                success: function (result) {
                }
                });

Action in my Controller

public ActionResult EditDesignTemplate(List<data> data, string id)
    {
        var model = new DashBoardModel();
        model.FormDetails = new FormsCreationModel();
        int i=0;
        foreach (var dt in data)
        {
            model.FormDetails.formfields[i].field_id = dt.id;
            model.FormDetails.formfields[i].field_name = dt.text;
            model.FormDetails.formfields[i].field_type = "Field";
            i++;
        }

        model.Controls = new List<ControlsModel>();
        model.Controls = formRepository.GetDesignTempsDet(id);
        model.DesignTemplateId = id;
        return View(model);
    }

The Class

public class data
{
    public string id { get; set; }
    public string text { get; set; }
}

Error Message after receiving empty list

XMLHttpRequest cannot load http://localhost:3916/FormsCreation/EditDesignTemplate/?data=%5B%7B%22id%22…22id%22%3A%220000164%22%2C%22text%22%3A%22Sr.+IRON%22%7D%5D&id=0006PL%255C. Invalid HTTP status code 500

Question:

Am I doing something wrong? Is that I shouldn't pass a list over GET method?

I think I wasn't even directed towards the action when I tried changing it to a POST Action. Got a 404 response for that..

Some Similar Questions

Passing A List Of Objects Into An MVC Controller Method Using jQuery Ajax

MVC Send list through AJAX

PS: I am trying to access this MVC action from a ASP.NET Webform through ajax. I am running dual projects in my solution.

malkam · Answer 1 · 2014-07-02T09:28:41.427

Try this:

var d=JSON.stringify({ 'data': data,'id':escape(report_kid)});
$.ajax({
                url: "http://localhost:3916/FormsCreation/EditDesignTemplate/",
                type: 'POST',
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                data: d,
                success: function (result) {
                }
                });

Add HTTPPOST to Action method.

[HttpPost]
public ActionResult EditDesignTemplate(List<data> data, string id)
    {
        var model = new DashBoardModel();
        model.FormDetails = new FormsCreationModel();
        int i=0;
        foreach (var dt in data)
        {
            model.FormDetails.formfields[i].field_id = dt.id;
            model.FormDetails.formfields[i].field_name = dt.text;
            model.FormDetails.formfields[i].field_type = "Field";
            i++;
        }

        model.Controls = new List<ControlsModel>();
        model.Controls = formRepository.GetDesignTempsDet(id);
        model.DesignTemplateId = id;
        return View(model);
    }

Use HTTP POST instead of GET, I've updated my solution. Check once — malkam, Jul 02 '14 at 09:30

score 0 · Answer 2 · answered Jul 02 '14 at 08:11

Try This:

var jsonObj = [];
             for (var i = 1; i < myTableArray.length; i++) {
                 var item = {};
                 item["Name"] = myTableArray[i][0];
                 item["Value"] = myTableArray[i][1];

                 jsonObj.push(item)
             }

$.ajax({
                 type: "POST",
                 contentType: "application/json; charset=utf-8",
                 url: "webmethod.aspx/dataarraypass",
                 data: "{html:" + JSON.stringify(jsonObj) + "}",
                 dataType: "json",
                 success: function (data)

use this u can pass multipe object

List not passed properly via ajax to Controller Action in MVC 4

2 Answers2