JSON將數據發佈到mvc控制器

我得到了一個包含Person和Address的實體類。JSON將數據發佈到mvc控制器

public class Person 
{ 
     public int Id { get; set; } 
     public string FirstName { get; set; } 
     public string LastName { get; set; } 

     public List<Address> Addresses { get; set; } 
} 

public class Address 
{ 
    public string ZipCode { get; set; } 
    public string City { get; set; } 
    public string State { get; set; } 
    public string Country { get; set; } 
}

在我看來，我顯示了一些複選框。

@model DataContext.Models.Persons 

@{ 
    ViewBag.Title = "Person list"; 
} 

@using (Html.BeginForm("Update", "Test", FormMethod.Post)) 
{ 

    <div id="personContainer"> 
     @foreach(var t in Model.Person) 
     { 
      <input type="checkbox" value="@t.ID" name="@t.FirstName ">@t.FirstName <br /> 
     } 
    </div> 
    <p> 
     <input type="submit" id="save"> 
    </p> 
}

我的控制器看起來是這樣的：

[HttpPost] 
public JsonResult Update(Person p) 
{ 

    return Json(new { redirectTo = Url.Action("Index") }); 
}

我要發佈的數據必須是強類型。如何將數據（在本例中爲所有複選框）回傳到使用JSON的'更新'控制器？

來源

2012-12-01 Yustme

是有什麼可以幫助我解決這個問題嗎？ – Yustme

您需要爲您的視圖模型的每個屬性的輸入。

每個輸入的名稱屬性需要與MVC識別它的屬性名稱相同。

例如：

@model Person 

@using (Html.BeginForm("Update", "Test", FormMethod.Post)) 
{ 
    @Html.HiddenFor(model => model.ID) 

    <input type="checkbox" value="@model.FirstName" name="FirstName ">@model.FirstName <br /> 
    <input type="checkbox" value="@model.LastName" name="LastName ">@model.LastName <br /> 
    @Html.EditorFor(model => model.Addresses) 

    <input type="submit" id="save"> 
}

對於地址，創建一個編輯模板，剃刀引擎將意識到，屬性是可枚舉。

的名稱屬性，這樣它會增加枚舉數：

<input id="addresses_0__city" type="text" value="City" name="addresses[0].city">

注意，名字有一個數組風格。

要創建編輯器模板，請在名爲「EditorTemplates」的「Shared」視圖文件夾（或相關視圖文件夾）中創建一個文件夾。
創建一個名爲Address的部分視圖（與該類型相同）。

添加要看到每個地址的HTML：

@model Address 

@Html.CheckBox("ZipCode", false, new { value = Model.ZipCode}) @Model.ZipCode 
<br /> 
@Html.CheckBox("City", false, new { value = Model.City}) @Model.City 
<br /> 
@Html.CheckBox("State", false, new { value = Model.State}) @Model.State 
<br /> 
@Html.CheckBox("Country", false, new { value = Model.Country}) @Model.Country 
<br />

這是可行的，但它不會發布形式JSON。如果您需要專門的崗位作爲JSON你可以在表單數據轉換成JSON上的AJAX POST：

$.ajax("/Test/Update", 
{ 
    type: "post", 

    data: JSON.stringify($('form').serializeObject()), // converting to JSON 
    contentType: 'application/json; charset=utf-8', 
    dataType: 'json', 
    success: function (data) {}  
    error: function() {} 
});

要JSON.stringify形式首次投入對象的形式使用這樣的：

$.fn.serializeObject = function() { 
    var obj = {}; 
    var arr = this.serializeArray(); 

    $.each(arr, function() { 
     var splt = this.name.split(".", 2); 
     if (splt.length === 2) { 
      if (obj[splt[0]] === undefined) { 
       obj[splt[0]] = {}; 
      } 
      obj[splt[0]][splt[1]] = this.value || ''; 
     } 
     else if (obj[this.name] !== undefined) { 
      if (!obj[this.name].push) { 
       obj[this.name] = [obj[this.name]]; 
      } 
      obj[this.name].push(this.value || ''); 
     } 
     else { 
      obj[this.name] = this.value || ''; 
     } 
    }); 
    return obj; 
};

來源

2013-09-11 10:38:34 anthr

設置一個jQuery方法在表格上運行提交發送序列化形式的控制器在開始表格

$('formSelector').submit(function() { 
    if ($(this).valid()) { 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      data: $(this).serialize(), 
      success: function (result) { 
       if (result.Success == true) { 

       } 
       else { 
        $('#Error').html(result.Html); 
       } 
      } 
     }); 
    } 
    return false; 
});

來源

2012-12-01 20:40:59 Oli

什麼是formSelector？我試過了你的代碼，但是當數據到達控制器時，數據是空的。我錯過了什麼嗎？ – Yustme

@Yustme這將成爲你的表格的路徑，所以如果你的表單的ID爲「person」，你將有$（'＃person'）。submit。如果這是頁面上唯一的表單，您可以使用$（'form'）。submit來選擇提交按鈕。我假設你知道jQuery語法。 – Oli

沒有深厚的知識，只是一些基礎知識。但是，你如何提交所有複選框與他們的ID以供日後參考？ – Yustme

JSON將數據發佈到mvc控制器

回答

相關問題