>웹 프론트엔드 >JS 튜토리얼 >jQuery Validator는 Ajax 양식 제출 방법과 Ajax 매개변수 전달 방법을 확인합니다(그림 및 텍스트 자습서).

jQuery Validator는 Ajax 양식 제출 방법과 Ajax 매개변수 전달 방법을 확인합니다(그림 및 텍스트 자습서).

亚连
亚连원래의
2018-05-22 10:18:481790검색

이 글에서는 Ajax 제출 양식을 확인하는 jQuery Validator의 방법과 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의 유효성 검사도 사용하려는 경우 다음과 같이 해결할 수 있습니다. : 양식은 여전히 ​​일반적으로 작성된 양식 콘텐츠이고 유형은 여전히 ​​제출 유형이지만 유효성 검사 방법에서는 양식을 제출하는 데 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; 
     } 
});

위 내용은 제가 모두를 위해 편집한 내용입니다. 도움이 되기를 바랍니다. 앞으로도 모든 사람에게.

관련 기사:

Ajax 도메인 간 요청의 원리(그래픽 튜토리얼)

dwz ajaxloading을 제거하는 방법(그래픽 튜토리얼)

Ajax는 node js multer와 협력하여 파일 업로드 기능을 구현합니다.

위 내용은 jQuery Validator는 Ajax 양식 제출 방법과 Ajax 매개변수 전달 방법을 확인합니다(그림 및 텍스트 자습서).의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.