jQuery - 我可以从序列化的表单字符串中填写表单输入吗?

时间:2011-09-19 06:21:07

标签: jquery query-string form-fields auto-populating form-processing

鉴于我在页面上有一些表单,我知道我可以使用

获得一个unicode序列化字符串
var query = jQuery('#some-form').serialize();

还可以使用$('#some-input').val(...)设置每个输入的值。假设重置了上面的相同表单,但我仍然有查询字符串 - 是否有一种简单的方法从该字符串填充表单?我意识到我可以解析它并单独设置每个输入/选择,但我正在寻找一个更简单的解决方案。感谢。

3 个答案:

答案 0 :(得分:1)

jquery.deserialize plugin可以帮到你。

答案 1 :(得分:1)

您可以将表单序列化为JSON数组,并使用像Knockout.js这样的MVVM映射插件来自动填充表单。

请参阅Serializing to JSON in jQuery

答案 2 :(得分:0)

如果你的表单只包含文本输入(不是数组),你可以尝试这个插件,我已经从它的unserialize函数对应(https://gist.github.com/rcmachado/242617#file-jquery-unserialize-js)改编,但它没有返回一个对象,它填充了形式适用于。

(function($){
    $.fn.fillformwithserialized = function(serializedString) {
        var str = decodeURI(serializedString);
        var pairs = str.split('&');
        var p, idx, val;
        for (var i=0, n=pairs.length; i < n; i++) {
            p = pairs[i].split('=');
            idx = p[0];

            var txtBox = this.find('#' + idx + ':input');
            if (txtBox.is(":text")) {
                txtBox.val(p[1]);
            }
        }

        return this;
    };
})(jQuery);

使用示例:

var dataSerialised = sessionStorage.getItem('frmVeryImportantStuff');

if (dataSerialised == null || !confirm("We could restore the previous version of the form you posted. Shall we?"))
return false;
else {
    $("#frmVeryImportantStuff").fillformwithserialized(dataSerialised);
}

显然,您首先需要在sessionStorage中保存表单。 示例:

sessionStorage.setItem("frmVeryImportantStuff", $(frmVeryImportantStuff).serialize());