將form.serialize（）綁定爲自定義對象

我試圖將一個AJAX帖子發送給MVC操作結果，並將一個自定義對象（ContactInformationModel）作爲操作結果的參數。但是，參數的預期類型顯然不正確，因爲該參數始終爲空。我認爲這是可能的，但也許不是？將form.serialize（）綁定爲自定義對象

我的行動的結果是：

[HttpPost] 
    public ActionResult UpdateContactInformation(ContactInformationModel model) 
    { 
     ... 
    }

我的jQuery：

//Serialize the ContactInformationModel object 
    var formData = $('#frmSubmitContactInformation').serialize(); 

    // Submit ajax call 
    $.ajax({ 
      url: "/api/[Redacted]/UpdateContactInformation", 
      type: "POST", 
      data: { model: formData }, 
      cache: false, 
      success: function (data) { 
       if (data.Success) { 
        alert('success'); 
       } else { 
        alert('fail'); 
       } 
      } 
    });

我的標記（ASP.NET MVC視圖）：

@model [Redacted].Output.ContactInformationModel 

<form id="frmSubmitContactInformation"> 
    Add contact information to your project <button type="button" class="strip-button js-contact-launch js-edit-toggle"><span class="icon icon-edit"></span></button> <button class="btn btn--small btn--green add-half-left-margin js-submit-btn-contactinfo js-contact-launch js-edit-toggle hidden" type="submit">@Translation.Text("done")</button> 
    @*Done Button*@ 
    <div class="js-contact-drawer hidden"> 
     <div class="reveal-output__form column column--no-vert-padding add-half-bottom-margin add-half-top-margin form-group"> 
      <div class="content-block"> 
       @* First/Last/Company Name *@ 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.FirstName) 
        @Html.TextBoxFor(x => x.FirstName, 
         new 
         { 
          @Value = Model == null ? "" : Model.FirstName, 
          @class = "form-control" 
         }) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.LastName) 
        @Html.TextBoxFor(x => x.LastName, 
         new 
         { 
          @Value = Model == null ? "" : Model.LastName, 
          @class = "form-control" 
         }) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.CompanyName) 
        @Html.TextBoxFor(x => x.CompanyName, 
         new 
         { 
          @Value = Model == null ? "" : Model.CompanyName, 
          @class = "form-control" 
         }) 
       </div> 
      </div> 
      <div class="content-block"> 
       @* Email/Phone *@ 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.EmailAddress) 
        @Html.ValidationMessageFor(x => x.EmailAddress) 
        @Html.TextBoxFor(x => x.EmailAddress, 
         new 
         { 
          @Value = Model == null ? "" : Model.EmailAddress, 
          @class = "form-control" 
         }) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.PhoneNumber) 
        @Html.ValidationMessageFor(x => x.PhoneNumber) 
        @Html.TextBoxFor(x => x.PhoneNumber, 
         new 
         { 
          @Value = Model == null ? "" : Model.PhoneNumber, 
          @class = "form-control" 
         }) 
       </div> 
      </div> 
      <div class="content-block"> 
       @* Address 1/Address 2 *@ 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.Address1) 
        @Html.TextBoxFor(x => x.Address1, 
         new 
         { 
          @Value = Model == null ? "" : Model.Address1, 
          @class = "form-control" 
         }) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.Address2) 
        @Html.TextBoxFor(x => x.Address2, 
         new 
         { 
          @Value = Model == null ? "" : Model.Address2, 
          @class = "form-control" 
         }) 
       </div> 
      </div> 
      <div class="content-block"> 
       @* City/State/Zip*@ 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.City) 
        @Html.TextBoxFor(x => x.City, 
         new 
         { 
          @Value = Model == null ? "" : Model.City, 
          @class = "form-control" 
         }) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.State) 
        @Html.DropDownListFor(x => x.State, AddressHelper.GetUnitedStatesListItems(), Translation.Text("state"), new {@class = "custom-select"}) 
       </div> 
       <div class="content-block__third-column"> 
        @Html.LabelFor(x => x.PostalCode) 
        @Html.ValidationMessageFor(x => x.PostalCode) 
        @Html.TextBoxFor(x => x.PostalCode, 
         new 
         { 
          @Value = Model == null ? "" : Model.PostalCode, 
          @class = "form-control" 
         }) 
       </div> 
      </div> 
      <input type="hidden" name="ProjectId" value="@Model.ProjectId" /> 
     </div> 
    </div> 
</form>

我敢肯定的是類在視圖中引用的內容與我在控制器中引用的內容完全相同。另外，JS本身運行良好。可能是什麼問題？

來源

2016-11-10 Paul

它只是'數據：FORMDATA;'（'formData'已經是正確的序列化對象） –

附註 - 從來沒有嘗試設置'value'屬性（和你的'@Value =型號== NULL？「」：Model.PostalCode，「無論如何都不做任何事情，所以刪除它們）--HtmlHelper'方法將始終設置正確的值，唯一可能的結果是使模型綁定失敗 –

D'oh。讓我試着使用data：formData。另一方面，在視圖中設置默認值的更好方法是什麼？ – Paul

Paul，

問題是你的數據對象。您需要直接發佈序列化表單對象作爲數據。

$.ajax({ 
     url: "/api/[Redacted]/UpdateContactInformation", 
     type: "POST", 
     data: formData, 
     cache: false, 
     success: function (data) { 
      if (data.Success) { 
       alert('success'); 
      } else { 
       alert('fail'); 
      } 
     } 
});

來源

2016-11-11 00:20:25

將form.serialize（）綁定爲自定義對象

回答

相關問題