通过JQuery AJAX将对象数组传递给MVC Controller Action,Action Parameter始终为null

时间:2017-01-21 04:09:57

标签: jquery ajax asp.net-mvc-5

我在ASP.NET MVC中有以下控制器操作

[HttpPost]
    public JsonResult Save(List<Mixing> lstmixing)
    {
        int TMPMIXINGNO=0;
        foreach (Mixing mixing in lstmixing)
        {
            TMPMIXINGNO = mixing.MIXINGNO;
            Mixing obj = new Mixing();
            obj.MIXINGNO = mixing.MIXINGNO;
            obj.CARET = mixing.CARET;
            obj.PRICE = mixing.PRICE;
            obj.DATE = mixing.DATE;
            obj.DETAILS = mixing.DETAILS;
            obj.CREATE_TIMESTAMP = DateTime.Now;
            obj.LAST_EDIT_TIMESTAMP = DateTime.Now;
            obj.INVOICEDETAILID = mixing.INVOICEDETAILID;
            db.Mixings.Add(obj);
            db.SaveChanges();
        }
        var result = db.Mixings.Where(p => p.MIXINGNO == TMPMIXINGNO).ToList();
        return Json(result);

    }

我打算使用以下jquery ajax代码将mixing类型的对象数组发送到List<Mixing> lstmixing。但lstmixing始终为空。

btnAdd.click(function () {
        var DATA = [];
        var ID = $(".invoiceno").val();
        var serviceURL = '@Url.Action("Save", "Mixing")';
        $(".invoice_table tbody tr").each(function () {
            var MIXINGNO = $(".mixingno").val();
            var DATE = $(".date").val();
            var INVOICEDETAILID = $(this).find("td:first").text();
            var CARET = $(this).find("td:eq(3) input").val();
            var PRICE = $(this).find("td:eq(2)").text();
            var DETAILS = $(".details").val();

            if (CARET != "") {
                DATA.push("{'MIXINGNO':'" + MIXINGNO + "','DATE': '" + DATE + "','INVOICEDETAILID': '" + INVOICEDETAILID + "','CARET': '" + CARET + "','PRICE': '" + PRICE + "','DETAILS': '" + DETAILS + "'}");
            }


        })
        alert(DATA);
        $.ajax({
            type: "POST",
            url: serviceURL,
            data: JSON.stringify({ 'lstmixing': "[" + DATA + "]" }),
            traditional:true,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                var str = "";
                $.each(data, function () {
                    var obj = $(this)[0];
                    str += "<tr>";
                    str += "<td>" + obj.ID + "</td>";
                    str += "<td class='text-right'>" + parseFloat(obj.CARET).toFixed(2) + "</td>";
                    str += "<td class='text-right'>" + parseFloat(obj.PRICE).toFixed(2) + "</td>";
                    str += "<td><input type='text' class='form-control text-right'' /></td>";
                    str += "</tr>";
                });
                $(".invoice_table tbody").html(str);
            }

        });
    });

JSON请求在GOOGLE CHROME开发者工具网络中加载

lstmixing:"[{'MIXINGNO':'2','DATE': '20/01/2017','INVOICEDETAILID': '10','CARET': '100','PRICE': '100.00','DETAILS': 'NO'},{'MIXINGNO':'2','DATE': '20/01/2017','INVOICEDETAILID': '11','CARET': '200','PRICE': '200.00','DETAILS': 'NO'}]"

模型 - Mixing.cs

public class Mixing
{
    [Key]
    public int ID { get; set; }

    [Display(Name = "Mixing No")]
    [Required]
    public int MIXINGNO { get; set; }

    [Display(Name = "Date")]
    [DataType(DataType.Date)]
    [DisplayFormat(DataFormatString = "{0:dd/MM/yyyy}", ApplyFormatInEditMode = true)]
    public DateTime DATE { get; set; }


    [Display(Name = "Invoice Detail ID")]
    [Required]
    public int INVOICEDETAILID { get; set; }

    [Display(Name = "Caret")]
    [Required]
    public decimal CARET { get; set; }

    [Display(Name = "Price")]
    [Required]
    public decimal PRICE { get; set; }

    [Display(Name = "Details")]
    public string DETAILS { get; set; }

    [ScaffoldColumn(false)]
    public DateTime CREATE_TIMESTAMP { get; set; }
    [ScaffoldColumn(false)]
    public DateTime LAST_EDIT_TIMESTAMP { get; set; }
}

这里有什么问题?

3 个答案:

答案 0 :(得分:1)

您有2个错误导致json无效。首先将项添加到数组中,使用

urlpatterns = patterns(
    url(r'^some_url$', your_app.some_view),

)

DATA.push({MIXINGNO: MIXINGNO, DATE: DATE, INVOICEDETAILID: INVOICEDETAILID, CARET: CARET, PRICE: PRICE, DETAILS: DETAILS }); 选项也不正确(data已经是数组)并且它必须是

DATA

请注意,$.ajax({ type: "POST", url: serviceURL, data: JSON.stringify({ 'lstmixing': DATA }), contentType: "application/json; charset=utf-8", dataType: "json", success: function (data) { 也应删除

答案 1 :(得分:1)

您的操作参数为null,因为您必须修改从ajax向此发送数据属性的方式:

$.ajax({
    type: "POST",
    url: serviceURL,
    data: JSON.stringify({ 'lstmixing': DATA }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function (data) {...

最后,在数组中插入数据时,您可能会遇到另一个问题。我的意思是这一行:

DATA.push("{'MIXINGNO':'" + MIXINGNO + "','DATE': '" + DATE + "','INVOICEDETAILID': '" + INVOICEDETAILID + "','CARET': '" + CARET + "','PRICE': '" + PRICE + "','DETAILS': '" + DETAILS + "'}");

您正试图插入数组对象,就像它们已经是对象类型JSON一样,您必须这样做的方式就是像javascript普通对象一样插入它们,如下所示:

DATA.push({
    MIXINGNO: MIXINGNO,
    DATE:  DATE,
    INVOICEDETAILID: INVOICEDETAILID,
    CARET: CARET,
    PRICE: PRICE,
    DETAILS:  DETAILS 
});

答案 2 :(得分:-1)

我认为您的错误在于您发送给控制器的数据

JSON.stringify({ 'lstmixing': "[" + DATA + "]" })

试试这个:

JSON.stringify(DATA)