将HTML表发布到ADO.NET DataTable [英] Post an HTML Table to ADO.NET DataTable

问题描述

我的视图中有一个HTML表格，如下所示:

I have a HTML table as below in my View:

<table id="tblCurrentYear">
    <tr>
        <td>Leave Type</td>
        <td>Leave Taken</td>
        <td>Leave Balance</td>
        <td>Leave Total</td>
    </tr>
    @foreach (var item in Model.LeaveDetailsList)
    {
        <tr>
            <td>@Html.TextBoxFor(m => item.LeaveType, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveTaken, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveBalance, new { width = "100" })</td>
            <td>@Html.TextBoxFor(m => item.LeaveTotal, new { width = "100" })</td>
        </tr>
    }
</table>

我想遍历所有html表行并将值插入ADO.NET DataTable.

I want to iterate through all the html table rows and insert the values in ADO.NET DataTable.

简单来说，就是将HTML表转换为ADO.NET DataTable.

Simple speaking, converting HTML Table to ADO.NET DataTable.

如何从HTML表中提取值并将其插入ADO.NET DataTable中?

How to extract values from HTML Table and insert into ADO.NET DataTable?

该视图基于以下模型

public class LeaveBalanceViewModel
{
    public LeaveBalanceViewModel()
    {
        this.EmployeeDetail = new EmployeeDetails();
        this.LeaveBalanceDetail = new LeaveBalanceDetails();
        this.LeaveDetailsList = new List<LeaveBalanceDetails>();
    }
    public EmployeeDetails EmployeeDetail { get; set; }
    public LeaveBalanceDetails LeaveBalanceDetail { get; set; }
    public List<LeaveBalanceDetails> LeaveDetailsList { get; set; }
}

推荐答案

为了在回发时绑定到模型，表单控件的name属性必须与模型属性匹配.您使用foreach循环不会生成正确的名称属性.如果您检查html，您将看到

In order to bind to a model on post back, the name attributes of the form controls must match the model properties. Your use of a foreach loop does not generate the correct name attributes. If you inspect the html you will see multiple instances of

<input type="text" name="item.LeaveType" .../>

但是要绑定到模型，控件必须是

but in order to bind to your model the controls would need to be

<input type="text" name="LeaveDetailsList[0].LeaveType" .../>
<input type="text" name="LeaveDetailsList[1].LeaveType" .../>

等考虑这一点的最简单方法是考虑如何使用C#代码

etc. The easiest way to think about this is to consider how you would access the value of a LeaveType property in C# code

var model = new LeaveBalanceViewModel();
// add some LeaveBalanceDetails instances to the LeaveDetailsList property, then access a value
var leaveType = model.LeaveDetailsList[0].LeaveType;

由于您的POST方法将具有参数名称(例如model)，因此只需删除前缀(model)，这就是控件的名称属性的方式.为此，您必须使用for循环(集合必须实现IList<T>)

Since your POST method will have a parameter name (say model), just drop the prefix (model) and that's how the name attribute of the control must be. In order to do that you must use either a for loop (the collection must implement IList<T>)

for(int i = 0; i < Model.LeaveDetailsList.Count; i++)
{
    @Html.TextBoxFor(m => m.LeaveDetailsList[i].LeaveType)
    ....
}

或使用自定义的EditorTemplate(该集合仅需要实现IEnumerable<T>)

or use a custom EditorTemplate (the collection need only implement IEnumerable<T>)

在/Views/Shared/EditorTemplates/LeaveBalanceDetails.cshtml

@model yourAssembly.LeaveBalanceDetails
<tr>
    <td>@Html.TextBoxFor(m => m.LeaveType)</td>
    ....
</tr>

然后在主视图中(不在循环中)

and then in the main view (not in a loop)

<table>
    .... // add headings (preferably in a thead element
    <tbody>
        @Html.EditorFor(m => m.LeaveDetailsList)
    </tbody>
</table>

最后，在控制器中

public ActionResult Edit(LeaveBalanceViewModel model)
{
    // iterate over model.LeaveDetailsList and save the items
}

这篇关于将HTML表发布到ADO.NET DataTable的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！