2013-03-08 2 views
6

전적으로 기본적인 튜토리얼에 익숙합니다. jQuery 양식 플러그인을 사용하고 있습니다.jQuery 유효성 검사 - 옵션을 선택하면 다음 옵션을 지정하지 않아도됩니까?

"연락처 유형"이 선택된 양식을 만들려고합니다. 전화 "옵션을 선택하면"연락 시간 "이 필요하지만"이메일 "을 선택하면"연락 시간 "이 필요하지 않습니다.

* 양식 html. *

<form id="askquestion" action="questionprocess.php" method="post"> 

       <td><label for="response type">Method of contact:</label></td> 
       <td><select name="response_type"> 
        <option value="" selected="selected">-- Please select --</option> 

        <option value="Phone">Phone</option> 
        <option value="Email">Email</option> 
        </select></td> 
        </tr> 

        <td><label for="response time">Best time to contact:</label></td> 
       <td><select name="contact_time"> 
        <option value="" selected="selected">-- Please select --</option> 
        <option value="morning_noon">Morning to Noon</option> 
        <option value="noon_afternoon">Noon to afternoon</option> 
        <option value="evenings">Evenings</option> 
        </select></td> 
        </tr> 


     </form> 

jQuery를 규칙 :

$(function() { 
    // Validate the contact form 
    $('#askquestion').validate({ 
    // Specify what the errors should look like 
    // when they are dynamically added to the form 
    errorElement: "label", 
    wrapper: "td", 
    errorPlacement: function(error, element) { 
     error.insertBefore(element.parent().parent()); 
     error.wrap("<tr class='error'></tr>"); 
     $("<td></td>").insertBefore(error); 
    }, 

    // Add requirements to each of the fields 
    rules: { 

     response_type: { 
      required:true, 
     }, 


     contact_time: { 
      required:true, 
     }, 

업데이트. 유효성 검사 양식이 끝나는 방식입니다.

// Use Ajax to send everything to form processing file 
    submitHandler: function(form) { 
     $("#send").attr("value", "Sending..."); 
     $(form).ajaxSubmit({ 
      success: function(responseText, statusText, xhr, $form) { 
       $(form).slideUp("fast"); 
       $("#response").html(responseText).hide().slideDown("fast"); 
      } 
     }); 
     return false; 
    } 
    }); 
}); 

답변

6
rules: { 
    response_type: { 
     required: true, 
     contact_time: { 
      depends: function() { 
       return $('#askquestion select[name="response_type"]').val() === 'Phone'; 
      } 
     } 
    }, 

그것은 문서입니다 : 그것에 대해 http://docs.jquery.com/Plugins/Validation/validate#code

+0

감사합니다,이 가파른 학습 곡선을 가지고, 나는 그것이 어떤 유효성을 검사하지 것처럼 내가 닫는 브래킷을 필요로 생각합니다. 'code'rules : { RESPONSE_TYPE : { 필요 : 사실, }, contact_time : { 는 따라 달라집니다 기능() { 반환 $ ('#의 askquestion에서 [이름 = "RESPONSE_TYPE"]') 발을 (.) === 'Phone';'code' response_type과 contact_time 모두에 필요한 값을 무시합니다. –

+1

@FindingMozart, 물론, 사과, 개체를 제대로 닫아야합니다. 나는 답을 편집하여 누락 된 괄호를 추가했습니다. 고마워. –

+0

내가 말했듯이, 멍청한 놈을 완성 시켰고, 내가 제공 한 코드를 이해하고 배우려고 노력하면서, 내가 도움을 요청하는 것을 더 신경 쓰지 않기를 바랍니다. 바로 지금, 양식은 response_type의 전자 메일이 선택되면 contact_time에 대한 유효성 검사가 필요하지 않습니다. 그러나 양식에서 전화를 선택하면 양식이 손상되고 (로컬 비 서버 환경에서) PHP 페이지가 표시됩니다. 제가 누락 된 것이 있습니까? 나는 전화가 필요하다는 것을 알고 있다고 추측 하겠지만 그것이 선택되었을 때 무엇을해야할지 모른다. –

관련 문제