データグリッドdevextremeをコントローラにasp.net mvc投稿する方法

Question

私はdevextremeでDataGridを使用しています。 どのように私はasp.net mvcのコントローラにdatagridを送ることができますか？ 私は私の見解では、これを試してみました：

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

をして、これは私のモデルである：私のcontollerで

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を使用できます。

@(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) { 
     //... 
    } 
} 

まあ、サーバにすべてのデータグリッドのデータを送信する必要はありませんその場合、あなたは次のようにWEBAPIコントローラにグリッドをバインドすることができます側。更新されたデータだけを管理してください。

データバインディングに関する追加情報がthis articleにあります。

this demoもご覧ください。

Answer 2

私の質問には私の方法がありました。ここでは が解決策です。 https://www.devexpress.com/Support/Center/Question/Details/T489645 デベロッパーサポートのおかげで

Answer 3

すべての列に対してcellTemplateを使用できます。hidden inputを使用する必要があります。たとえば、次のコードを仮定します。

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