양식에서 눈에 띄지 않는 유효성 검사 사용 안 함 MVC

Question

페이지에 두 개의 양식이 있습니다. 첫 번째 양식은 눈에 띄지 않는 유효성 검사 (MVC에 의해 자동 생성되므로)를 사용하지만 수동으로 작성한 두 번째 형식은 unobstrive 유효성 검사를 사용하지 않기를 원합니다.

@using (Html.BeginForm("Add", "Contacts", FormMethod.Post, new { id = "AddForm" })) 
{ 
    @Html.ValidationSummary(true) 

    <fieldset> 
     <legend>Datos Contacto</legend> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.Name) 
     </div> 
     <div class="editor-field"> 
      @Html.EditorFor(model => model.Name) 
      @Html.ValidationMessageFor(model => model.Name) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.ContactDepartmentID) 
     </div> 
     <div class="editor-field"> 
      @Html.DropDownListFor(model => model.ContactDepartmentID, (List<SelectListItem>)ViewBag.ContactDepartments) 
      @Html.ValidationMessageFor(model => model.ContactDepartmentID) 
     </div> 
     <div class="editor-label"> 
      @Html.LabelFor(model => model.Sex) 
     </div> 
     <div class="editor-field"> 
      @Html.DropDownListFor(model => model.Sex, (List<SelectListItem>)ViewBag.Sexs) 
      @Html.ValidationMessageFor(model => model.Sex) 
     </div> 
    </fieldset> 
    <br /> 
    @Html.HiddenFor(model => model.SerializedEmails, new { data_bind = "value: ko.toJSON($root.emails())" }) 
    @Html.HiddenFor(model => model.SerializedPhones, new { data_bind = "value: ko.toJSON($root.phones())" }) 
} 
<form id="phoneForm" > 
<fieldset> 
    <legend>Teléfonos</legend> 
    <table class="table"> 
     <tbody data-bind="foreach: phones"> 
      <tr> 
       <th> 
        Celular? 
       </th> 
       <th> 
        Phone 
       </th> 
       <th> 
        Extension 
       </th> 
       <th> 
       </th> 
      </tr> 
      <tr> 
       <td> 
        <input type="checkbox" data-bind="checked: isMobile" /> 
       </td> 
       <td> 
        <input class="phone" data-bind='value: phone'/> 
       </td> 
       <td> 
        <input type="text" class="extension" data-bind='value: phoneExtension, enable: !isMobile() ' /> 
       </td> 
       <td> 
        <a href='#' data-bind='click: $root.removePhone'>Delete</a> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
    <a href='#' data-bind='click: $root.addPhone'>Agregar teléfono</a> 
</fieldset> 
</form> 
<p> 
    <button onclick="Submit();" type="button" class="btn btn-primary" data-bind='enable: phones().length > 0 || emails().length > 0'> 
     Create</button> 
</p> 

JS : 사이드 참고로

function Submit() 
     {  
      var valid = $('#AddForm').valid();  
      var valid2 = $('#phoneForm').valid();  

     } 

     jQuery.validator.addClassRules("phone", { 
      required: true 
     }); 

: 여기

일부 코드이다 나 제 형태 유효화 페이지에서 방해를 제거하지만, 첫번째 아닌 경우 때 눈에 거슬리지 않는 첫 번째는 유효하지만 두 번째는 유효하지 않습니다.

클라이언트 측에서 전체 유효성 검사를 수행 할 수 있다는 것을 알고 있습니다. 나는 MVC의 커스텀 태그를 눈에 띄지 않는 밸리데이션으로 유지하는 방법에 대해 생각하고 있었고 어떤면에서는 단일 폼이나이 경우에는 녹아웃 추가 요소에 대해 눈에 거슬리지 않고 유효성 검사를 사용하는 페이지를 알려줍니다.

감사합니다.

Answer 1

unobtrusive-validation을 제거하면 jQuery Validate 플러그인 만 사용하게됩니다.

그런 경우라면 플러그인 설명서를 따라야합니다. The .valid() method can only be used after the plugin is first initialized via the .validate() method. 참조 : http://jqueryvalidation.org

그러나 submit 함수 또는 처리기 안에는 아무 것도 래핑 할 필요가 없습니다. 플러그인은 플러그인이 제대로 초기화되면 제출 이벤트를 자동으로 캡처합니다.

$(document).ready(function() { 

    $('#myform').validate({ 
     // rules and options 
    }); 

    jQuery.validator.addClassRules("phone", { 
     required: true 
    }); 

}); 

간단한 데모 : http://jsfiddle.net/DW4qE/

Answer 2

당신은이 HTML 도우미 속성을 통해 면도칼 코드 내에서 눈에 거슬리지 유효성 검사를 비활성화 할 수 있습니다

HtmlHelper.ClientValidationEnabled = false; 

그 방법을 당신과 오프 눈에 거슬리지 유효성 검사를 할 수 있습니다 특정보기/부분보기에서이 설정에 따라 다른 양식.

Answer 3

form의 input을 모두 찾아서 규칙을 제거하면이 샘플은 사용자가 일부 옵션을 선택하면이 원인에 따라 원인이되는 일부 컨트롤의 모든 규칙을 제거하기위한 것이며 값 필요한 것은 다른 것입니다. 이런 이유로 나는 나중에 그것을 복구하는 규칙을 저장합니다.

///Remove rules 
$("input.rO,textarea.rO").each(function() { 
    try 
    { 
     var rule = $(this).rules(); 
     if (rule) { 
     $(this).data("rule", rule); 
     $(this).rules("remove"); 
    } 
    } 
    catch(err){} 
}); 
///Restore rules 
$("input.rO.om" + v + ",textarea.rO.om"+v).each(function() { 
     try 
     { 
     var rule = $(this).data("rule"); 
     if (rule) 
      $(this).rules("add", rule); 
     } 
     catch(err){} 
    });