두 개의 제출 버튼을 사용하여 Jquery를 사용하여 폼 유효성 검사

Question

단일 폼이 있고 그 중 3 개의 텍스트 상자에 2 개의 제출 버튼이 있습니다. 켜기 버튼 텍스트 상자 1의 유효성을 검사하고 다른 버튼 2가 확인해야하는 버튼 B를 제출해야합니다. 제출 처리기를 사용하고 ajax를 사용하여 양식을 제출했습니다.

내 문제는 A를 클릭하면 B가 클릭되면 B의 처리기를 호출하지 않는다는 것입니다. 무엇이든지 먼저 클릭하면 다른 방법은 효과가 없습니다.

도와주세요!

function set_new_rate(oid) { 
    alert("set_new_rate"); 
    $("#TestForm").validate({ 
     event: "custom", 
     rules: { 
      client_new_rate: { 
       required: true, 
       number: true 
      }, 
      agent_new_rate: { 
       required: true, 
       number: true 
      } 
     }, 
     messages: { 
      client_new_rate: { 
       required: "Required", 
       number: "Invalid Rate" 
      }, 
      agent_new_rate: { 
       required: "Required", 
       number: "Invalid Rate" 
      } 
     }, 
     submitHandler: function() { 
      var client_new_rate = $('#client_new_rate').val(); 
      var agent_new_rate = $('#agent_new_rate').val(); 

      var answer = confirm("Set New Rate for this Order?") 
      if (answer) 
      { 
       $.post('http://localhost/fc/index.php/disp/set_new_rate/',{order_id:oid,client_new_rate:client_new_rate,agent_new_rate:agent_new_rate},function(data){ 
        if(data==1) 
        { 
         $('#rateupdated').html('<div id="display_message" class="msg msg-ok" style="margin:0 0 5px 0px;width:180px;"><p>Rate Updated Successfully!</p></div>'); 
         $("#rateupdated").fadeIn(0).fadeOut(5000); 
         $('#rec_ord_cnt_prc'+oid).html(client_new_rate); 
         $('#client_old_rate').html(client_new_rate); 
         $('#agent_old_rate').html(agent_new_rate); 
         $('#client_new_rate').val(''); 
         $('#agent_new_rate').val(''); 
        } 
       }); 
      } 
     } 
    }); 
} 

function add_note(oid) 
{ 
    alert("add_note"); 

    $("#TestForm").validate({ 
     event: "custom", 
     rules: { 
      note_description: { 
       required: true 
      } 
     }, 
     messages: { 
      note_description: { 
       required: "Required" 
      } 
     }, 
     submitHandler: function() { 
      alert("add_note _ sh"); 
      var note_description = $('#note_description').val(); 
      var note_type = $('input:radio[name=note_type]:checked').val(); 
      var answer = confirm("Add this "+note_type+" Note?") 
      if (answer) 
      { 
       $.post('http://localhost/fc/index.php/disp/add_note/',{order_id:oid,note_description:note_description,note_type:note_type},function(data){ 
        if(data==1) 
        { 
         $('#noteadded').html('<div id="display_message" class="msg msg-ok" style="margin:5px 5px 5px 0px;width:282px;"><p>Note Added Successfully!</p></div>'); 
         $('#note_description').val(''); 
         $("#noteadded").fadeIn(0).fadeOut(5000); 
        }        
       }); 
      } 
     } 
    }); 
} 

것은 내가 JQuery와 유효성 검사 플러그인을 사용하고 있습니다 :

내 코드는 다음과 같습니다.

Answer 1

submitHandler 호출 대신 jquery 내장 이벤트 핸들을 사용하면 어떨까요?

$('.MyForm .set_rate').click(function(e){ 
    set_new_rate(oid); 
    //here your submitHandler call function 
}); 

$('.MyForm .add_note').click(function(e){ 
    add_note(oid); 
    //here your submitHandler call function 
}); 

는 (필자는 복사 기능을 시도했지만 텍스트 영역은 나에게 오류를 주었다. 당신의 기능에서 단지 두 경우 모두에 submitHandler을 delet.이 방법의 유효성을 검사하려는 이유

가