2013-11-01 120 views
1

所以我有這個js文件的形式將數據存儲在本地存儲:如何從存儲在localStorage中的表單數據填充表單?

$(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. 

}); 

它的工作,但我不知道如何檢索信息回來,如果用戶輸入到現場預填充表單以驗證數據在各自領域是否正確。我知道如何做到這一點,如果字段單獨存儲,但我不知道如何做,如果它像序列化的例子。

的工作example由Sparky的製造,我只是說window.localStorage(...)

BTW:有是超過100場不只是3作爲例子。

回答

1

我發現了一種從URL中獲取JSON的方法,並且我修改爲滿足localStorage條件。

從一月Turoň原有功能在此post

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; 
} 

輸出這個函數是一個數組,並在我的情況下,將填補在窗體中提交之前的輸入時自動將表單提交出來。

希望這可以幫助任何人。

相關問題