如何将 HTML 标签绑定到模型，以便它显示数据？

Question

我有一个列表，要借助 ViewModel 从 GET 方法发送到视图。我打算将列表数据发送到 View 只是为了在屏幕上显示它。我希望此标签在标签的视图中逐一显示列表数据（因为我不想编辑数据）。然后，在点击 SUBMIT 后，我希望将相同的列表数据发送到 POST 方法，我可以在其中保存数据。另外，我想在不使用 HTML Helpers 的情况下执行此操作。

这是我的资料：

MyView.cshtml

<html>
    ...
    <table class="table table-striped table-bordered" id="myTable"> 
        <thead>
            <tr>
                <th>Items</th>
            </tr>
        </thead>
        <tbody>
            @for (var i = 0; i < Model.MyList.Count(); i++)
            {
                <tr>
                    <td>
                        // This is where I want to display the label. 
                        <label name="MyList[@i]">@Model.MyList[i].ToString()</label>
                    </td>
                </tr>
            }
        </tbody>
    </table>
</html>

MyController.cs

[HttpPost]
public ActionResult MyMethod(MyViewModel VMObject)
{
    ...
}

我可以在 <label name="MyList[@i]">@Model.MyList[i].ToString()</label> 视图中显示列表内容。但是，在 POST 方法中返回的 ViewModel 对象显示列表是 null。我哪里错了？

编辑 - 07/31

MyViewModel.cs

public class MyViewModel
{
    public int ID { get; set; }
    public string ItemCode { get; set; }
    public int ItemId { get; set; }
    public string ItemName { get; set; }

    public List<string> MyList { get; set; }
}

Answer 1

您可能需要添加一个隐藏的输入字段。因此你的循环看起来像;

@for (var i = 0; i < Model.MyList.Count(); i++)
{
   <tr>
     <td> 
       <label>@Model.MyList[i].ToString()</label>
       <input name="MyList[@i]" value="@MyList[i].ToString()" hidden />
     </td>
   </tr>
}

Answer 2

由于您不想使用 html 助手，您可能会寻找 ajax 请求

您可以使用此脚本并将其放在提交按钮的点击事件中。

$.ajax({
        url: '@Url.Content("~/*CONTROLLERNAME*/MyMethod")',
        type: 'POST',
        dataType: json,
        data:  @Html.Raw(Json.Encode(Model)),
        success: function (data) {
        }
    });

通过使用@Html.Raw(Json.Encode(Model))，您正在将视图模型转换为 Json 数据，可由 ajax 请求读取。

如何将 HTML 标签绑定到模型，以便它显示数据？

How to bind HTML label to Model so that it displays data?

asp.net-mvc

label

model-binding