따라서 로컬 저장소에 양식 데이터를 저장하는이 js 파일이 있습니다.
$(document).on('pageinit', function() { // dom ready handler for jQuery Mobile
$('#form1').validate({ // initialize form 1
// rules
});
$('#gotoStep2').on('click', function() { // go to step 2
if ($('#form1').valid()) {
// code to reveal step 2 and hide step 1
}
});
$('#form2').validate({ // initialize form 2
// rules
});
$('#gotoStep3').on('click', function() { // go to step 3
if ($('#form2').valid()) {
// code to reveal step 3 and hide step 2
}
});
$('#form3').validate({ initialize form 3
// rules,
submitHandler: function (form) {
// serialize and join data for all forms
var data = $('#form1').serialize() + '&' + $('#form2').serialize() + '&' + $(form).serialize();
window.localStorage.setItem('formData',data);
// ajax submit
return false; // block regular form submit action
}
});
// there is no third click handler since the plugin takes care of this
// with the built-in submitHandler callback function on the last form.
});
작업을 수행하지만 사용자가 해당 필드의 데이터가 올바른지 확인하기 위해 사이트에 입력하면 해당 정보를 다시 검색하여 양식을 미리 채우는 방법을 모르겠습니다. 필드가 개별적으로 저장되는 경우 수행하는 방법을 알고 있지만 예제와 같이 직렬화하면 수행하는 방법을 모르겠습니다.
Sparky가 만든 작업 예제 , 방금 추가했습니다.window.localStorage(...)
BTW : 예제에서와 같이 3 개뿐 아니라 100 개가 넘는 필드가 있습니다.
URL에서 JSON을 가져 오는 메서드를 찾았고 localStorage 기준을 충족하도록 수정했습니다.
이 게시물의 Jan Turoň의 원래 기능 :
function getJsonFromUrl() {
var query = location.search.substr(1);
var data = query.split("&");
var result = {};
for(var i=0; i<data.length; i++) {
var item = data[i].split("=");
result[item[0]] = item[1];
}
return result;
}
그리고 이것은 수정 된 버전입니다.
function getFormFromLocalStorage(station,set,container) {
var query = ls.getItem(station+set+container);
var data = query.split("&");
var result = {};
for(var i=0; i<data.length; i++) {
var item = data[i].split("=");
$('#'+item[0]).val(item[1]);
}
return result;
}
이 함수의 출력은 배열이며, 제 경우에는 양식에 제출 된 이전 입력으로 양식을 자동으로 채 웁니다.
이것이 누구에게나 도움이되기를 바랍니다.
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다