Question

早上好，我正在.Net 3.1和Razor页面中开发我的Web应用程序。在我的页面之一中，我有一个表格，该表格的各个列中都有一些输入字段，用户可以根据自己的喜好进行修改。

<table id="myTbl" class="display nowrap table-sm table-striped table-hover table-bordered" >
<thead>
    <tr>
        <th>Col1</th>
        <th>Col2</th>
        <th>Col3</th>
        <th>Col4</th>
        <th>Col5</th>
        <th>Col6</th>
    </tr>
</thead>
<tbody>
    @foreach (var prop in Model.Props)
    {
    <tr>
        <td>@prop.Unitid</td>
        <td>
            <input type="checkbox" checked="@Model.Method1(prop.Unitid)" />
        </td>
        <td>
            <input type="checkbox" checked="@Model.Method2(prop.Unitid)" />
        </td>
        <td>
            <input type="text" placeholder="@Model.Method3(prop.Unitid)" />
        </td>
        <td>
            <input type="text" placeholder="@Model.Method4(prop.Unitid)" />
        </td>
        <td>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxV" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "V")" />
                <label class="custom-control-label" for="@("checkBoxV" + prop.Unitid)">V</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxW" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "W")" />
                <label class="custom-control-label" for="@("checkBoxW" + prop.Unitid)">W</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxS" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "S")" />
                <label class="custom-control-label" for="@("checkBoxS" + prop.Unitid)">S</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxP" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "P")" />
                <label class="custom-control-label" for="@("checkBoxP" + prop.Unitid)">P</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxA" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "A")" />
                <label class="custom-control-label" for="@("checkBoxA" + prop.Unitid)">A</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxM" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "M")" />
                <label class="custom-control-label" for="@("checkBoxM" + prop.Unitid)">M</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxU" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "U")" />
                <label class="custom-control-label" for="@("checkBoxU" + prop.Unitid)">U</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" id="@("checkBoxD" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "D")" />
                <label class="custom-control-label" for="@("checkBoxD" + prop.Unitid)">D</label>
            </div>
        </td>
    </tr>
    }

</tbody>

在我的页面中，我还有一个按钮，通过该按钮，我可以扫描表的所有行，并将该行的值传递给一个方法，如果该特定行满足某些条件，它将更新使用EF Core的数据库具有来自该行字段的数据。

实现我的目标的最佳实践是什么？我可以将整个表格与模型属性相关联并扫描模型中的行吗？

谢谢！

Answer 1

实现我的目标的最佳实践是什么？我可以将整个表格与模型属性相关联并扫描模型中的行吗？

要达到上述要求，可以使处理程序方法OnPost接受一个参数，并为输入字段指定name属性以匹配自定义模型类的属性，这将有助于绑定自动赋予模型属性值。

自定义模型类

public class MyCustomModel
{
    public int Unitid { get; set; }
    public bool Col2Checked { get; set; }
    public bool Col3Checked { get; set; }
    public string Col4Val { get; set; }
    public string Col5Val { get; set; }

    public Col6Childs Col6Val { get; set; }
}

public class Col6Childs
{
    public bool IsV { get; set; }
    public bool IsW { get; set; }
    public bool IsS { get; set; }
    public bool IsP { get; set; }
    public bool IsA { get; set; }
    public bool IsM { get; set; }
    public bool IsU { get; set; }
    public bool IsD { get; set; }
}

处理程序方法

public IActionResult OnPost(List<MyCustomModel> myCustomModel)
{
    //code logic here
    //...

页面内

<form method="post">
    <table id="myTbl" class="display nowrap table-sm table-striped table-hover table-bordered">
        <thead>
            <tr>
                <th>Col1</th>
                <th>Col2</th>
                <th>Col3</th>
                <th>Col4</th>
                <th>Col5</th>
                <th>Col6</th>
            </tr>
        </thead>
        <tbody>

            @foreach (var prop in Model.Props)
            {


                <tr>
                    <td>
                        @prop.Unitid
                        <input type="hidden" name="myCustomModel[@index].Unitid" value="@prop.Unitid">
                    </td>
                    <td>
                        <input type="checkbox" checked="@Model.Method1(prop.Unitid)" name="myCustomModel[@index].Col2Checked" />
                    </td>
                    <td>
                        <input type="checkbox" checked="@Model.Method2(prop.Unitid)" name="myCustomModel[@index].Col3Checked" />
                    </td>
                    <td>
                        <input type="text" placeholder="@Model.Method3(prop.Unitid)" name="myCustomModel[@index].Col4Val" />
                    </td>
                    <td>
                        <input type="text" placeholder="@Model.Method4(prop.Unitid)" name="myCustomModel[@index].Col5Val" />
                    </td>
                    <td>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxV" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "V")" name="myCustomModel[@index].Col6Val.IsV" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsV" value="false" />
                            <label class="custom-control-label" for="@("checkBoxV" + prop.Unitid)">V</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxW" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "W")" name="myCustomModel[@index].Col6Val.IsW" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsW" value="false" />
                            <label class="custom-control-label" for="@("checkBoxW" + prop.Unitid)">W</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxS" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "S")" name="myCustomModel[@index].Col6Val.IsS" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsS" value="false" />
                            <label class="custom-control-label" for="@("checkBoxS" + prop.Unitid)">S</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxP" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "P")" name="myCustomModel[@index].Col6Val.IsP" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsP" value="false" />
                            <label class="custom-control-label" for="@("checkBoxP" + prop.Unitid)">P</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxA" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "A")" name="myCustomModel[@index].Col6Val.IsA" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsA" value="false" />
                            <label class="custom-control-label" for="@("checkBoxA" + prop.Unitid)">A</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxM" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "M")" name="myCustomModel[@index].Col6Val.IsM" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsM" value="false" />
                            <label class="custom-control-label" for="@("checkBoxM" + prop.Unitid)">M</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxU" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "U")" name="myCustomModel[@index].Col6Val.IsU" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsU" value="false" />
                            <label class="custom-control-label" for="@("checkBoxU" + prop.Unitid)">U</label>
                        </div>
                        <div class="custom-control custom-checkbox custom-control-inline">
                            <input type="checkbox" id="@("checkBoxD" + prop.Unitid)" class="custom-control-input" checked="@Model.Method5(prop.Unitid, "D")" name="myCustomModel[@index].Col6Val.IsD" value="true" />
                            <input type="hidden" name="myCustomModel[@index].Col6Val.IsD" value="false" />
                            <label class="custom-control-label" for="@("checkBoxD" + prop.Unitid)">D</label>
                        </div>
                    </td>
                </tr>

               index++;     
            }
        </tbody>
    </table>
    <input type="submit" value="Submit" />
</form>

测试结果

在剃刀页面的OnPost方法上浏览HTML表

1 个答案: