양식 유효성 검사 전에 제출

Question

I 데이터베이스에 공급하는 데 필요한 다음과 같은 형식을 가지고 있지만 나는 그것이 데이터베이스에 저장되기 전에이를 검증하고자 :

<form name="add_walkin_patient_form" class="add_walkin_patient_form" id="add_walkin_patient_form" autocomplete="off" > 

       <div class="form-line"> 

        <div class="control-group"> 
         <label class="control-label"> 
          Patient Name 
         </label> 
         <div class="controls"> 
          <input type="text" name="patientname" id="patientname" required="" value=""/> 
         </div> 
        </div> 
        <div class="control-group"> 
         <label class="control-label"> 
          Patient Phone Number 
         </label> 
         <div class="controls"> 
          <input type="text" name="patient_phone" id="patient_phone" required="" value=""/> 
         </div> 
        </div> 
        <div class="control-group"> 
         <label class="control-label"> 
          Department 
         </label> 
         <div class="controls"> 
          <select name="department" required="" class="department" id="department"> 
           <option value="">Please select : </option> 
           <option value="Pharmacy">Pharmacy</option> 
           <option value="Laboratory">Laboratory</option> 
           <option value="Nurse">Nurse</option> 

          </select> 
         </div> 
        </div> 
       </div> 

       <button name="add_walkin_patient_button" type="submit" id="add_walkin_patient_button" class="btn add_walkin_patient_button btn-info pull-right"> 
        Add Walk In Patient 
       </button> 
      </form> 

그리고 제출 a로 이루어집니다 jquery 스크립트를 사용하십시오.

<script type="text/javascript"> 

    $(document).ready(function() { 
     //delegated submit handlers for the forms inside the table 
     $('#add_walkin_patient_button').on('click', function (e) { 
      e.preventDefault(); 

      //read the form data ans submit it to someurl 
      $.post('<?php echo base_url() ?>index.php/reception/add_walkin', $('#add_walkin_patient_form').serialize(), function() { 
       //success do something 

       // $.notify("New Patient Added Succesfully", "success",{ position:"left" }); 
       $(".add_walkin_patient_form").notify(
         "New Walkin Patient Added Successfully", 
         "success", 
         {position: "center"} 
       ); 
       setInterval(function() { 
        var url = "<?php echo base_url() ?>index.php/reception/"; 
        $(location).attr('href', url); 
       }, 3000); 


      }).fail(function() { 
       //error do something 
       $(".add_walkin_patient_form").notify(
         "There was an error please try again later or contact the system support desk for assistance", 
         "error", 
         {position: "center"} 
       ); 

      }) 
     }) 

    }); 

</script> 

입력을 스크립트에 보내기 전에 양식 유효성 검사를 어떻게 수행 할 수 있습니까? 당신이 사용하는

Answer 1

, 여기

<button name="add_walkin_patient_button" type="submit" id="add_walkin_patient_button" class="btn add_walkin_patient_button btn-info pull-right"> 
     Add Walk In Patient 
</button> 

이 submit 버튼이 양식을 제출에 사용되며 이벤트를 클릭 트리거하지 않습니다. 먼저 제출이 실행되어 click 이벤트가 건너 뜁니다. 당신이 문제에 지금 normal 버튼 대신 submit 버튼

<input type="button">Submit</button> 

를 사용한 경우

$('#add_walkin_patient_button').on('click', function (e) { 

이

은 일 것입니다. 이 두 가지 솔루션,

당신은 당신이 수동으로 올바른 검증 경우에 제출 트리거 할 이벤트를 클릭하여 사용하는 경우

,

<input type="button" id="add_walkin_patient_button">Submit</button> 
//JS : 
$("#add_walkin_patient_button").click(function() { 
    if(valid){ 
    $("#form-id").submit(); 
    } 

또 다른 옵션은 submit 이벤트를 사용하는 것입니다 수 있습니다, 당신이 클릭 한 후 트리거되는 제출 버튼. 여기

$("#form-id").submit(function(){ 
    if(invalid){ 
    //Suppress form submit 
     return false; 
    }else{ 
     return true; 
    } 
}); 

PS

, 양식을 제출하거나 확인 기준에 기반을 중단 할 수 있도록하거나 필요 @sherin-mathew