我有一个表单在同一页面显示Center Details
及其PartnerDetails
。在编辑页面方案中,我已将所有当前合作伙伴详细信息以及该条款绑定到Add New Row
新的Partners
将被添加。
jquery unobstrusive validation
成功显示当前有界的项目,但添加了新行,不对新添加的行执行验证。
HTML DataTable
<table id="tblPartnerDetails" class="table table-bordered table-hover">
<thead>
<tr>
<th></th>
<th>Name</th>
<th>ContactNo</th>
<th>EmailId</th>
<th>Alt ContactNo</th>
<th>Alt EmailId</th>
<th></th>
</tr>
</thead>
<tbody>
@for (int i = 0; i < Model.CenterCodePartnerDetail.Count; i++)
{
<tr>
@Html.HiddenFor(m => Model.CenterCodePartnerDetail[i].Id)
<td class="slno">
@Convert.ToInt32(i + 1)
</td>
<td>
@Html.TextBoxFor(m => m.CenterCodePartnerDetail[i].PartnerName,
new { @class = "form-control PartnerName", @placeholder = "PartnerName" })
@Html.ValidationMessageFor(m => m.CenterCodePartnerDetail[i].PartnerName)
</td>
<td>
@Html.TextBoxFor(m => m.CenterCodePartnerDetail[i].ContactNumber,
new { @class = "form-control ContactNumber numberOnly", @placeholder = "ContactNumber", @id = "txtContactNumber" })
@Html.ValidationMessageFor(m => m.CenterCodePartnerDetail[i].ContactNumber)
</td>
<td>
@Html.TextBoxFor(m => m.CenterCodePartnerDetail[i].EmailId,
new { @class = "form-control EmailId", @placeholder = "Email", @id = "txtEmailId" })
@Html.ValidationMessageFor(m => m.CenterCodePartnerDetail[i].EmailId)
</td>
<td>
@Html.TextBoxFor(m => m.CenterCodePartnerDetail[i].AltContactNumber,
new { @class = "form-control AltContactNumber numberOnly", @placeholder = "AltContactNo", @id = "txtAltContactNo" })
@Html.ValidationMessageFor(m => m.CenterCodePartnerDetail[i].AltContactNumber)
</td>
<td>
@Html.TextBoxFor(m => m.CenterCodePartnerDetail[i].AltEmailId,
new { @class = "form-control AltEmailId", @placeholder = "AltContactNo", @id = "txtAltEmailId" })
@Html.ValidationMessageFor(m => m.CenterCodePartnerDetail[i].AltEmailId)
</td>
</tr>
}
</tbody>
<tfoot>
<tr>
<th colspan="6">
<button id="btnAddRow" class="btn btn-sm btn-info pull-right ">
<i class="fa fa-plus"></i>
Add Row
</button>
</th>
</tr>
</tfoot>
Jquery AddRow函数
$(document).on("click", "#btnAddRow", function(e) {
var rowCount = $('#tblPartnerDetails tbody tr').length;
AddRow(rowCoun);
return false;
});
var AddRow = function(rows) {
var slno = parseInt(rows + 1);
var i = parseInt(rows);
var $row = $('<tr/>');
$row.append(' <td class="slno">' + slno + '</td>');
$row.append(' <td><input name="CenterCodePartnerDetail[' + i + '].PartnerName" type="text" class="form-control capitalise PartnerName valid" data-val="true" data-val-required="PartnerName" placeholder="PartnerName" />'
+ '<span class="field-validation-valid spanPartnerName" data-valmsg-for="CenterCodePartnerDetail[' + i + '].PartnerName" data-valmsg-replace="true"></span> </td>');
$row.append(' <td><input name="CenterCodePartnerDetail[' + i + '].ContactNumber" type="text" class="form-control ContactNumber numberOnly" data-val="true" data-val-required="ContactNumber" placeholder="ContactNo" id="txtContactNumber" />'
+ '<span class="field-validation-valid spanContactNumber" data-valmsg-for="CenterCodePartnerDetail[' + i + '].ContactNumber" data-valmsg-replace="true"></span> </td>');
$row.append(' <td><input name="CenterCodePartnerDetail[' + i + '].EmailId" type="text" class="form-control EmailId" data-val="true" data-val-required="EmailId" data-val-email="Invalid EmailId" placeholder="EmailId" id="txtEmailId" />'
+ '<span class="field-validation-valid spanEmailId" data-valmsg-for="CenterCodePartnerDetail[' + i + '].EmailId" data-valmsg-replace="true"></span> </td>');
$row.append(' <td><input name="CenterCodePartnerDetail[' + i + '].AltContactNumber" type="text" class="form-control AltContactNumber numberOnly" data-val="true" data-val-required="AltContactNumber" placeholder="AltContactNo" id="txtAltContactNumber" />'
+ '<span class="field-validation-valid spanAltContactNumber" data-valmsg-for="CenterCodePartnerDetail[' + i + '].AltContactNumber" data-valmsg-replace="true"></span> </td>');
$row.append(' <td><input name="CenterCodePartnerDetail[' + i + '].AltEmailId" type="text" class="form-control AltEmailId" data-val="true" data-val-required="AltContactNumber" data-val-email="Invalid EmailId" placeholder="AltEmailId" id="txtAltContactNumber" />'
+ '<span class="field-validation-valid spanAltEmailId" data-valmsg-for="CenterCodePartnerDetail[' + i + '].AltEmailId" data-valmsg-replace="true"></span> </td>');
$row.append('<td><div class="tools"><a class="btn rowDelete"><i class="fa fa-trash-o " style="color:red"></i></a></div></td>');
$("#tblPartnerDetails tbody tr:last").after($row);
};
中心等级
public class CenterCodePartnerDetailsMetaData
{
[Required(ErrorMessage = "PartnerName", AllowEmptyStrings = false)]
public string PartnerName { get; set; }
[Required(ErrorMessage = "ContactNumber", AllowEmptyStrings = false)]
public string ContactNumber { get; set; }
[Required(ErrorMessage = "EmailId", AllowEmptyStrings = false)]
[EmailAddress(ErrorMessage="Invalid EmailId")]
public string EmailId { get; set; }
[Required(ErrorMessage = "AltContactNumber", AllowEmptyStrings = false)]
public string AltContactNumber { get; set; }
[Required(ErrorMessage = "AltEmailId", AllowEmptyStrings = false)]
[EmailAddress(ErrorMessage = "Invalid EmailId")]
public string AltEmailId { get; set; }
}