Jquery动态添加行到HtmlDatatable无法验证?

时间:2015-10-21 07:14:32

标签: jquery asp.net-mvc-4 jquery-validate unobtrusive-validation

我有一个表单在同一页面显示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; }


}

0 个答案:

没有答案