MVC 3 다시 게시 후 면도기 유효성 검사

Question

고객 정보가 렌더링 된 양식이 있습니다. 드롭 다운 메뉴가 변경되면 JavaScript로 새 양식 요소가 HTML에 삽입됩니다. 이 이벤트 이후에 유효성을 검사하는 자바 스크립트가 있습니다.

양식을 게시 할 때 모델의 새 요소 배열을 가져옵니다. 이제 서버 유효성 검사를 수행하고 오류가 발생하면 모든 사항을보기로 되돌리고이 시간에 면도기를 사용하여 새 요소를 생성합니다. 지금까지 좋은 모든 것. 그러나 클라이언트 측 유효성 검사가 작동하지 않습니다! 양식의 다른 요소에 대해 유효성을 검사하지만 컬렉션에서 생성 된 유효성 검사는 수동으로 추가하지 않았습니다.

데이터 배열 속성이 요소 배열에 없다는 것을 알 수 있습니다.

값 배열에 대한 반복을 포함하여 뷰가 모두 함께 렌더링되는 경우 왜 양식의이 섹션에서 클라이언트 유효성 검사를받지 못합니까? 내보기의 일부입니다

@{if (Model.pasajeros != null) 
     { 
      for (int i = 0; i < Model.pasajeros.Count(); i++) 
      { 
      <p>Pasajero: @(i + 1)</p> 
      <table> 
       <tr> 
        <td><span class="lblspan">Nombre</span></td><td><span class="lblspan">Primer Apellido</span></td><td><span class="lblspan">Segundo Apellido</span></td> 
       </tr> 
       <tr> 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].name, new { @class = "txtboxsmall" })<br />@Html.ValidationMessageFor(x => x.pasajeros[i].name)</td> 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].lname, new { @class = "txtboxsmall" })<br />@Html.ValidationMessageFor(x => x.pasajeros[i].lname)</td> 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].lname2, new { @class = "txtboxsmall" })<br />@Html.ValidationMessageFor(x => x.pasajeros[i].lname2)</td> 
       </tr> 
       <tr> 
        <td><span class="lblspan">Fecha de Nacimiento (mm/dd/yyyy)</span></td><td style="vertical-align: bottom"><span class="lblspan">Sexo</span></td><td></td> 
       </tr> 
       <tr> 
        <td>@Html.TextBoxFor(x => x.pasajeros[i].dob, new { @class = "txtboxsmall" })<br />@Html.ValidationMessageFor(x => x.pasajeros[i].dob)</td> 
        <td>@Html.DropDownListFor(x => x.pasajeros[i].sex, Model.sexoItems, new { @class = "ddlsmall" })</td><td></td> 
       </tr> 

      </table> 

     <p>@Html.RadioButtonListFor(x => x.pasajeros[i].radioselect, Model.radioItems) </p> 

     <table> 
      <tr> 
      @if (Model.pasajeros[i].radioselect == "pass") 
      { 
      <td style="vertical-align: bottom"><span class="lblspan" id="@("numeroA" + i.ToString())">Número de Pasaporte Americano</span><span id="@("numeroR" + i.ToString())" class="statehide">Número de Residencia</span></td> 
      } 
      else 
      { 
      <td style="vertical-align: bottom"><span class="statehide" id="@("numeroA" + i.ToString())">Número de Pasaporte Americano</span><span id="@("numeroR" + i.ToString())" class="lblspan">Número de Residencia</span></td> 
      } 
      <td style="vertical-align: bottom"><span class="lblspan">Fecha de Vencimiento</span></td> 
      <td><span class="lblspan">Número de Pasaporte Cubano</span></td><td style="vertical-align: bottom"><span class="lblspan">Fecha de Vencimiento</span></td> 
      </tr> 
      <tr> 
       @if (Model.pasajeros[i].radioselect == "pass") 
       { 


       <td>@this.TextBox(x => x.pasajeros[i].numAmericanPassport).Id("numAmericanPassport" + i).Class("txtboxsmall") 

       @this.TextBox(x => x.pasajeros[i].numResidencia).Id("numResidencia" + i).Class("statehide").Disabled(true) 
       <br /> @Html.ValidationMessageFor(x => x.pasajeros[i].numAmericanPassport) @Html.ValidationMessageFor(x => x.pasajeros[i].numResidencia)</td> 
       <td> 
       @this.TextBox(x => x.pasajeros[i].expAmericanPassport).Id("expAmericanPassport" + i).Class("txtboxsmall") 

       @this.TextBox(x => x.pasajeros[i].expResidencia).Id("expResidencia" + i).Class("statehide").Disabled(true) 
       <br /> @Html.ValidationMessageFor(x => x.pasajeros[i].expAmericanPassport) @Html.ValidationMessageFor(x => x.pasajeros[i].expResidencia)</td> 
       } 
       else 
       { 
       <td>@this.TextBox(x => x.pasajeros[i].numAmericanPassport).Id("numAmericanPassport" + i).Class("statehide").Disabled(true) 

       @this.TextBox(x => x.pasajeros[i].numResidencia).Id("numResidencia" + i).Class("txtboxsmall") 
       <br /> @Html.ValidationMessageFor(x => x.pasajeros[i].numAmericanPassport) @Html.ValidationMessageFor(x => x.pasajeros[i].numResidencia)</td> 
       <td> 
       @this.TextBox(x => x.pasajeros[i].expAmericanPassport).Id("expAmericanPassport" + i).Class("statehide").Disabled(true) 

       @this.TextBox(x => x.pasajeros[i].expResidencia).Id("expResidencia" + i).Class("txtboxsmall") 
       <br /> @Html.ValidationMessageFor(x => x.pasajeros[i].expAmericanPassport) @Html.ValidationMessageFor(x => x.pasajeros[i].expResidencia)</td> 
       } 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].numCubanPassport, new { @class = "txtboxsmall" })</td> 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].expCubanPassport, new { @class = "txtboxsmall" })</td> 
      </tr> 
      <tr> 
       <td><span class="lblspan">Habilitación</span></td><td><span class="lblspan">Documento</span></td><td colspan="2"></td> 
      </tr> 
      <tr> 
       <td>@Html.TextBoxFor(x => x.pasajeros[i].visa, new { @class = "txtboxsmall" })</td> 
       <td colspan="3"><input type="file" name="documents[@i]" /></td> 
      </tr> 
     </table> 
     <hr /> 
     } 
    } 

}

눈에 거슬리지 유효성 검사를 등록하기 위해 당신이 DOM에 새로운 요소를 추가 한 후에는 parse 메소드를 호출 할 필요가

Answer 1

:

$.validator.unobtrusive.parse('#id_of_the_form_containing_newly_added_inputs'); 

분명히 이러한 요소에는 원하는 유효성 검사 규칙을 나타내는 해당 HTML5 data-* 속성이 있어야합니다. 서버에 추가 된 입력과 동일한 방법으로 적용하십시오.