jQuery Validator가 Ajax 양식 제출을 확인하는 방법과 Ajax가 매개변수를 전달하는 방법에 대한 자세한 예

이 글에서는 주로 Ajax 제출 양식을 확인하는 방법과 Ajax 전달 매개변수 방법을 소개합니다. 또한 구체적인 예제 코드는 이 글을 참조하세요. 그것이 당신을 도울 수 있기를 바랍니다.

serialize() 메서드는 양식 값을 직렬화하여 URL로 인코딩된 텍스트 문자열을 생성합니다. 매개변수를 하나씩 전달하는 대신.

기존에 작성한 ajax 매개변수 전달 방식

$.ajax({ 
        url : "${ctx}/SJStandardDamPartition/insertOrUpdateDamPartition", 
        type : "post", 
        dataType : "json", 
        data: {beginsectionid:function(){
              return $('#number option:selected').val();
            },
            beginelevation:function(){
              return $('#onset').val();
            },
            endelevation:function(){
              return $('#end').val();
            }
        }, 
        success : function(result) { 
        } 
      });

serialize() 매개변수 전달 방식 사용

 var param = $("#standForm").serialize(); 
       $.ajax({ 
        url : "${ctx}/SJStandardStandardInfo/insertOrUpdateStandardInfo", 
        type : "post", 
        dataType : "json", 
        data: param, 
        success : function(result) { 
        } 
      });

조금 복잡한 사업을 하다보면 같은 페이지에 여러 개의 양식이 필요한 상황이 발생할 수 있지만, 만약 양식을 제출한 후 페이지를 새로 고치거나 이동하는 것을 원하지 않는 경우, 양식의 Ajax 제출을 고려하면 어떻게 jQuery의 유효성 검사기 플러그인이 비동기적으로 제출된 양식의 유효성을 검사할 수 있을까요? 계속해서 아래를 살펴보겠습니다.

여기에서는 인터넷의 예를 사용하여 설명하겠습니다.

다음은 jquery .ajax 제출 양식을 작성하는 비교적 일반적인 방법입니다

$("#submitButton").click(function(){ 
//序列化表单 
  var param = $("#leaveSave").serialize(); 
  $.ajax({ 
   url : "leaveSave.action", 
   type : "post", 
   dataType : "json", 
   data: param, 
   success : function(result) { 
if(result=='success') { 
location.href='allRequisitionList.action'; 
} else if(result.startWith("error_")){ 
$("#errorMessage").html(result.substring(6)); 
} else { 
//返回的结果转换成JSON数据 
var jsonObj = eval('('+result+')'); 
startTime = $("#startdate").val(); 
endTime = $("#enddate").val(); 
hour = jsonObj.hour; 
reason = jsonObj.reason; 
 
replaceDom(startTime,endTime,hour,reason); 
} 
} 
}); 
});

Ajax를 사용하여 양식을 제출하고 확인을 위해 jquery의 유효성 검사도 사용하려는 경우 다음과 같이 해결할 수 있습니다. 양식은 다음과 같습니다. 여전히 일반적으로 작성된 양식 콘텐츠이고 유형은 여전히 ​​submit Type입니다. 검증을 통과한 후 ajax를 사용하여 검증 메소드에서 양식을 제출하세요

$("#saveWorkExtra").validate({ 
onsubmit:true,// 是否在提交是验证 
onfocusout:false,// 是否在获取焦点时验证 
onkeyup :false,// 是否在敲击键盘时验证 
rules: { 
.... 
}, 
messages:{ 
.... 
}, 
submitHandler: function(form) { //通过之后回调 
   var param = $("#saveToWorkExtra").serialize(); 
   $.ajax({ 
url : "workExtraChange.action", 
type : "post", 
dataType : "json", 
data: param, 
success : function(result) { 
if(result=='success') { 
     location.href='allRequisitionList.action'; 
} else { 
     var jsonObj = eval('('+result+')'); 
} 
} 
   }); 
     }, 
     invalidHandler: function(form, validator) { //不通过回调 
    return false; 
     } 
});

관련 권장사항:

BootStrap Validator 검증 메소드

BootStrap Validator 사용 시 주의사항(필독)

Parsing javascript 동적 매개변수 전송 및 동적 속성.

위 내용은 jQuery Validator가 Ajax 양식 제출을 확인하는 방법과 Ajax가 매개변수를 전달하는 방법에 대한 자세한 예의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!