form.serialise向控制器返回null

时间:2019-09-05 23:51:07

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

我是一名新程序员,我试图通过使用form.serialise发送新行来使用ajax在数据库中添加一行。我要发送的模型新行是用于创建视图的主要模型的部分

我知道有一种繁琐的方法来遍历每一列以匹配数据库中表的列,但是,我想使用更简单的选项-使用ajax。

这是我的模型的一部分,用于创建视图:

              public ActionResult CreateCheck(Appliance NewAppliance)
    {
            db.Appliances.InsertOnSubmit(app);
        db.SubmitChanges();

        var appIndb = (from a in db.Appliances
                             where a.ApartmentID == app.ApartmentID
                             select a).LastOrDefault();

              var applianceNew= appRepo.Add(appIndb );
                  return Json(new { success = true, appliance = 
             applianceNew}, 
                     JsonRequestBehavior.AllowGet);
                      }

这是我的控制器方法:

                     <form id="hidden-form-appliance">
                @Html.AntiForgeryToken()

                <div class="form-horizontal">


                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })


                    <br />

                    <div class="flex-container">
                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin">Appliance Name </p>
                            @*@Html.LabelFor(model => model.NewAppliance.ApplianceName, htmlAttributes: new { @class = "control-label col-md-2" })*@
                            <div class="inputModal" id="applianceNameDiv">
                                @Html.EditorFor(model => model.NewAppliance.ApplianceName, new { htmlAttributes = new { @class = "form-control", id = "applianceName" } })
                                @Html.ValidationMessageFor(model => model.NewAppliance.ApplianceName, "", new { @class = "text-danger" })
                            </div>
                        </div>


                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin"> Unit</p>
                            <div class="inputModal">
                                @{ var unitsList = new List<SelectListItem>();


                                    foreach (var item in Model.AllApartmentsForID)
                                    {
                                        var unitType = new SelectListItem();
                                        unitType.Value = item.ApartmentID.ToString();
                                        unitType.Text = item.ApartmentNumber;


                                        unitsList.Add(unitType);
                                    }
                                }
                                @Html.DropDownListFor(model => model.NewAppliance.ApartmentID, unitsList, "Select Unit", new { @class = "form-control", @id = "ap_ApartmentID" })
                                @Html.ValidationMessageFor(model => model.NewAppliance.ApartmentID, "", new { @class = "text-danger" })


                            </div>
                        </div>






                    </div>



                    <div class="flex-container">

                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin"> Make</p>
                            <div class="inputModal">
                                @Html.EditorFor(model => model.NewAppliance.Make, new { htmlAttributes = new { @class = "form-control", id = "editedDistrict" } })
                                @Html.ValidationMessageFor(model => model.NewAppliance.Make, "", new { @class = "text-danger" })
                            </div>
                        </div>

                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin"> Model</p>
                            <div class="inputModal">
                                @Html.EditorFor(model => model.NewAppliance.Model, new { htmlAttributes = new { @class = "form-control", id = "editedDistrict" } })
                                @Html.ValidationMessageFor(model => model.NewAppliance.Model, "", new { @class = "text-danger" })
                            </div>
                        </div>

                    </div>



                    <div class="flex-container flex-vericalDirection removeMargin">
                        <p class="removeMargin">Description</p>

                        <textarea class="text-area-input-form">
                        @Model.NewAppliance.DescriptionDetails

                    </textarea>
                    </div>


                    <div class="flex-container">


                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin"> Store</p>
                            <div class="inputModal">
                                @Html.EditorFor(model => model.NewAppliance.Store, new { htmlAttributes = new { @class = "form-control", id = "editedAddress" } })
                                @Html.ValidationMessageFor(model => model.NewAppliance.Store, "", new { @class = "text-danger" })
                            </div>
                        </div>

                        <div class="flex-container flex-vericalDirection">
                            <p class="removeMargin"> Cost</p>
                            <div class="inputModal">
                                @Html.EditorFor(model => model.NewAppliance.Cost, new { htmlAttributes = new { @class = "form-control", id = "editedAddress" } })
                                @Html.ValidationMessageFor(model => model.NewAppliance.Cost, "", new { @class = "text-danger" })
                            </div>
                        </div>
                    </div>


                    <div class="flex-container flex-vericalDirection">
                        <p class="removeMargin"> Installed On</p>
                        <div class="inputModal">
                            @Html.EditorFor(model => model.NewAppliance.DateOfInstallment, new { htmlAttributes = new { @class = "form-control", id = "datepicker" } })
                            @Html.ValidationMessageFor(model => model.NewAppliance.DateOfInstallment, "", new { @class = "text-danger" })
                        </div>
                    </div>


                </div>
                </form>

这是我的观点-表单中的字段均为ALL                           html.editorfor或hiddenfor-我未指定                          任何一个的名字                          他们:

                                  $('.btn.btn-- 
                         primary.saveNewAppliance').on('click', 
                               function () {

            alert($('#hidden-form-appliance').serialize());

            $.ajax({

                url: '@Url.Action("CreateCheck", "Appliance")',
                data:{ NewAppliance: $('#hidden-form- 
                 appliance').serialize()},
              success: function(data) {
        if (data) {  // check if data is defined
           if (data.success) { // if success is true
               alert("It Worked!"); 

               }
             }
          }
         }); 

这是js:

            <form id="hidden-form-appliance">
                <input name="__RequestVerificationToken" type="hidden" 
             value="MLW1wQJnd0WnHyzEaOJO6kAEVm-r_9YYhDliWfy28Qxs6- 
                 Q6kabsK48RICT5uAIhtJ1WQ3Hrq6S-axQwIoMw5F32t6webLXW- 
                     T7npEad1lkn-7dVDO6HFyGcXsJpv2ayhiithucgvg3Ro2kd8Pk5MQ2" 
                         />

                               <input class="form-control text-box single- 
                            line" id="applianceName" 
                        name="NewAppliance.ApplianceName" 
                          type="text" value="" />



                                <select class="form-control" data- 
                           val="true" data-val-number="The field 
                            ApartmentID must be a number." 
                             id="ap_ApartmentID" 
                           name="NewAppliance.ApartmentID"><option 
                       value="">Select Unit</option>
                            </select>


                                <input class="form-control text-box single- 
                          line" id="editedDistrict" 
                               name="NewAppliance.Make" type="text" 
                value="" />

                                <input class="form-control text-box single- 
                            line" id="editedDistrict" 
                               name="NewAppliance.Model" type="text" 
                                           value="" />






                    <div class="flex-container flex-vericalDirection 
                            removeMargin">
                        <p class="removeMargin">Description</p>

                        <textarea class="text-area-input-form">


                    </textarea>



                                <input class="form-control text-box single- 
                               line" id="editedAddress" 
                           name="NewAppliance.Store" type="text" value="" 
                                  />



                                <input class="form-control text-box single- 
                                       line" data-val="true" data-val- 
                                   number="The field Cost must be a 
                                   number." id="editedAddress" 
                               name="NewAppliance.Cost" type="text" 
                           value="" />






                            <input class="form-control text-box single- 
                     line" data-val="true" data-val-date="The field 
                     DateOfInstallment must be a date." data-val- 
                         required="The DateOfInstallment field is 
                         required." id="datepicker" 
                     name="NewAppliance.DateOfInstallment" type="date" 
                       value="" />



            </form>

更新:这是源代码:

Appliance.ApplianceName=jhbk&Appliance.ApartmentID=1388&Appliance.ApplianceID=0&Appliance.Make=hhj&Appliance.Model=hku&Appliance.DescriptionDetails=bhjk&Appliance.Store=gjh&Appliance.Cost=789&Appliance.DateOfInstallment=09%2F08%2F2009

我收到错误“值不能为空”。 (设备模型发送为空)。

更新2:

console.log($('#hidden-form-appliance')。serialize())产生:

{{1}}

任何人都可以帮忙吗?谢谢

1 个答案:

答案 0 :(得分:0)

  

我没有为其指定名称

您似乎指定了编辑者的id属性,例如:

@Html.EditorFor(model => model.NewAppliance.Cost, new { htmlAttributes = new { @class = "form-control", id = "editedAddress" } })

什么可能会影响最终的请求数据对。由于您使用的是强类型编辑器,因此请尽量不要明确指定此html属性。如果您需要在js / css中进行操作,请尝试操作CSS类。