jquery - 绑定并验证具有 IList 的模型的输入

Question

我需要表单，在该表单上我的输入应该绑定到模型中的列表...示例

public class InviteMembersViewModel
    {
        public InviteMembersViewModel()
        {
            Members = new List<InviteMemberViewModel>();
        }
        public IList<InviteMemberViewModel> Members { get; set; }
        public string CompanyName { get; set; }
    }

我试试这样

$addNewItem.on('click', function () {
            var templateString = '<div id="item-template'+index+'">'
                + '<div class="card h-100 d-flex flex-column mx-2 px-2 py-3 mt-3 js-item-container">'
                + '<div class="d-flex">'
                + '<div class="flex-grow-1 mb-3 row">'
                + '<div class="text-nowrap text-100 text-dark-l2 col-md-6">'
                + '<label class="label">@Resources.EmailAddress</label>'
                + '<input class="form-control" data-val="true" data-val-email="Please enter email in name@domain form." data-val-length="Maximum number of characters is 256." data-val-length-max="256" data-val-length-min="0" data-val-regex="Please enter email in name@domain form." data-val-regex-pattern="^[a-zA-Z0-9_.+-]+' + '@Resources.AtSign' + '[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$" data-val-required="Email should not be empty." id="Members_' + index + '_Email" name="Members_' + index +'_Email" type="text" value="">'
                + '<span class="field-validation-valid text-danger" data-valmsg-for="Members_' + index + '_Email" data-valmsg-replace="true"></span>'
                + '</div>'
                + '<div class="text-nowrap text-100 text-dark-l2 col-md-6">'
                + '<label class="label">@Resources.NameOptional</label>'
                + '<input type="text" class="form-control" id="Members_' + index + '_Name" name="Members_' + index + '_Name" value />'
                + '</div>'
                + '</div>'
                + '</div>'
                + '<div class="position-tr m-1 dropdown dd-backdrop dd-backdrop-none-md">'
                + '<button type="button" class="btn btn-sm btn-brc-tp btn-bgc-tp btn-text-pale btn-light-red js-remove-item">'
                + '<i class="fa fa-trash-alt"></i>'
                + '</button>'
                + '</div>'
                + '</div>'
                + '</div>';
            $container.append($(templateString));
            index++;
        });

绑定正在工作，但表单的 JQuery 验证始终为真，即使服务器上的 ModelState 为假。

更糟糕的是，如果我使用 @Html.TextBoxFor 并仅绑定 List 中的一个元素，则验证可以正常工作，但如果我手动为模型属性添加输入和绑定名称，那将不起作用。

请帮我。我必须做什么？

标签： jqueryasp.net-mvcasp.net-coreunobtrusive-validation