jQuery_jquery에서 양식 제출 방법 확인 및 양식 내용 직렬화 구현

이전 프로젝트에서 사용된 양식 제출 방법

form() 메소드를 사용하여 제출 버튼과 제출 이벤트를 분리하고 모든 이벤트에 바인딩합니다

코드 복사 코드는 다음과 같습니다.

function addSubmit(){
$('#addForm').form('submit', {
url : _basePath '/@Controller/@RequestMapping',
onSubmit : function() {
if(boolean){//제출 가능 여부 판단 조건을 설정합니다
$.messager.show ({
title: 'Prompt',msg:'저장 조건을 충족하지 않습니다.',
showType:'fade',style:{right:'',bottom:''}
}); 🎜>return false;//양식 제출 차단
}
return $('#addForm').form('validate');//모든 필수 항목에 값이 있는지 판단
},
성공: function(data) {
var obj = jQuery.parseJSON(data);//반환된 JSON을 필수 개체(ResponseData)로 변환
if (!obj.success) {//속성 값 판단 반환된 ResponseData 객체의 상태 표시
$.messager.show({
title:'Prompt',msg:'Save failed',
showType:'fade',style:{right:'' ,bottom:''}
})
} else {
$.messager.show({
title:'Prompt',msg:'저장 성공',
showType:' fade',style:{right: '',bottom:''}
})
$("#addWin").window("close");//제출 닫기 pwkk
query( );//결과 집합 새로 고침
}
}
});
}

오늘 "Sharp jQuery"에서 ajax를 사용하는 또 다른 제출 방법을 읽었습니다. 양식 내용을 캡슐화합니다.

코드 복사 코드는 다음과 같습니다.

$ ("#btn").click( function() {

$.get("get.php", {사용자 이름:$("#username").val(), 비밀번호:$("#password") .val()}, function(data , textStatus) {//양식에서 데이터를 하나씩 제거하고 패키지하여 업로드합니다
$("#target").html(data);//반환 값 채우기 페이지에
});
})


serialize() 메서드를 사용하여

코드 복사 코드는 다음과 같습니다.

$("#btn").click(function() {

$.get ("get.php", $("#form").serialize( ), function(data, textStatus) {//폼에서 데이터를 하나씩 추출한 후 패키징하여 업로드합니다
$("# target").html(data);//페이지에 반환 값을 입력합니다
} );
});


serialize() 메서드는 자동으로 인코딩될 수 있으며, 체크박스와 같은 양식 이외의 개체도 이를 사용하여 변환할 수 있습니다

또한 serializeArray() 메서드는 요소를 직렬화하고 JSON 문자열 대신 배열 형식으로 JSON 개체를 반환할 수 있습니다
, 변환을 위해 jQuery.parseJSON() 메소드를 사용할 필요가 없습니다

반환값을 직접 사용할 수 있습니다. $.each()와 유사한 메소드를 사용하여 조작하십시오.