如何將數據網格devextreme發佈到控制器在asp.net mvc

Question

我已經使用devextreme datagrid。我如何發送數據網格控制器在asp.net mvc？ 我有我的觀點試過這樣：

@using (Html.BeginForm("action-name", "controller-name", FormMethod.Post)) 
      { 
       <div id="frm"></div> 
       <div id="grid"></div> 
       <div class="submit-button" id="submitBtn"></div> 
      } 

，這是我的模型：

public class class-name 
    { 
     public int id { get; set; } 
     public string Name { get; set; } 
     public string FName { get; set; } 
     public ContactInfo ContactInfo { get; set; } 
    } 

public class ContactInfo 
    { 
     public string type { get; set; } 
     public string value { get; set; } 
    } 

在我的位指示讓我的表單數據（類名），但網格數據（的ContactInfo）是null

Answer 1

在你的情況下，你可以使用ASP.NET MVC Wrappers for DevExtreme。在這種情況下，你將能夠結合這樣的網格的WebAPI控制器：

@(Html.DevExtreme().DataGrid() 
    .DataSource(ds => ds 
     .WebApi() 
     .Controller("GridData") 
     .Key("OrderID") 
     .LoadAction("GetAllOrders") 
     .InsertAction("InsertOrder") 
     .UpdateAction("UpdateOrder") 
     .DeleteAction("RemoveOrder") 
    ) 
) 

而且控制器：

public class DataGridWebApiController : ApiController { 

    [HttpGet] 
    public HttpResponseMessage GetAllOrders(DataSourceLoadOptions loadOptions) { 
     //... 
    } 

    [HttpPost] 
    public HttpResponseMessage InsertOrder(FormDataCollection form) { 
     //... 
    } 

    [HttpPut] 
    public HttpResponseMessage UpdateOrder(FormDataCollection form) { 
     //... 
    } 

    [HttpDelete] 
    public void RemoveOrder(FormDataCollection form) { 
     //... 
    } 
} 

嗯，這是沒有必要所有的數據網格的數據發送到服務器側。只管理更新的數據。

在this article中有關於數據綁定的附加信息。

看看this demo以及。

Answer 2

爲我的問題，我找到了我的方式。 這裏是解決方案。 https://www.devexpress.com/Support/Center/Question/Details/T489645 感謝devextreme支持。

Answer 3

你可以使用cellTemplate爲每一列和cellTemplate你必須使用隱藏輸入。例如假設此代碼：

factory.Add().DataField("Mobile") 
      .CellTemplate(@<text> 
       <%= text %> 
       <input type='hidden' name='Addresses[<%= rowIndex %>].Mobile' value='<%= value %>' /> 
       </text>); 

text，rowIndex，value是DevExtreme對象。 欲瞭解更多信息，請檢查cellInfo部分鏈接。 https://js.devexpress.com/Documentation/ApiReference/UI_Widgets/dxDataGrid/Configuration/columns/?search=columns