首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Backbone虹吸嵌套属性

Backbone虹吸嵌套属性
EN

Stack Overflow用户
提问于 2013-10-17 12:22:30
回答 2查看 945关注 0票数 2

我在一个表单中有以下HTML ...

代码语言:javascript
运行
复制
<input type="text" id="test1" name="steps[description]" value="one step">
<input type="text" id="test2" name="steps[description]" value="two step">

我只是尝试生成一个对象数组,如下面的JSON

代码语言:javascript
运行
复制
steps [ {description:"one step"}, {description:"two step"}]

但是,当我对表单进行Backbone.Syphon解析时,它总是只在如下所示的步骤数组中生成一个值(总是最后出现的具有该名称的输入字段

代码语言:javascript
运行
复制
steps [{description:"two step"}]

我的语法有问题吗?或者这在Backbone.Syphon中是不可能的?

EN

回答 2

Stack Overflow用户

发布于 2013-10-17 18:03:36

尝试使用以下方式命名输入

代码语言:javascript
运行
复制
<input type="text" id="test1" name="steps[][description]" value="one step">
<input type="text" id="test2" name="steps[][description]" value="two step">

注意,额外的[]使它成为一个实际的对象数组。

票数 0
EN

Stack Overflow用户

发布于 2014-01-03 19:29:22

将索引添加到每个相似的输入。

代码语言:javascript
运行
复制
<input type="text" id="test1" name="steps[1][description]" value="one step">
<input type="text" id="test2" name="steps[2][description]" value="two step">

在表单提交时,您可以像这样调用serializeObject函数:

代码语言:javascript
运行
复制
var data = $('#form' + formId).serializeObject();
this.model.save(data, {
    success : function(model) {
    },
    error : function(model) {
    }
});

您可以使用下面的serializeObject函数,该函数将解析上述语法。这与在此stackoverflow question中解决的问题相同

代码语言:javascript
运行
复制
$.fn.serializeObject = function() {
        var json, patterns, push_counters, _this = this;
        json = {};
        push_counters = {};
        patterns = {
            validate : /^[a-zA-Z][a-zA-Z0-9_]*(?:\[(?:\d*|[a-zA-Z0-9_]+)\])*$/,
            key : /[a-zA-Z0-9_]+|(?=\[\])/g,
            push : /^$/,
            fixed : /^\d+$/,
            named : /^[a-zA-Z0-9_]+$/
        };
        this.build = function(base, key, value) {
            base[key] = value;
            return base;
        };
        this.push_counter = function(key) {
            if(push_counters[key] ===
            void 0) {
                push_counters[key] = 0;
            }
            return push_counters[key]++;
        };
        $.each($(this).serializeArray(), function(i, elem) {
            var k, keys, merge, re, reverse_key;
            if(!patterns.validate.test(elem.name)) {
                return;
            }
            keys = elem.name.match(patterns.key);
            merge = elem.value;
            reverse_key = elem.name;
            while(( k = keys.pop()) !==
            void 0) {
                if(patterns.push.test(k)) {
                    re = new RegExp("\\[" + k + "\\]$");
                    reverse_key = reverse_key.replace(re, '');
                    merge = _this.build([], _this.push_counter(reverse_key), merge);
                } else if(patterns.fixed.test(k)) {
                    merge = _this.build([], k, merge);
                } else if(patterns.named.test(k)) {
                    merge = _this.build({}, k, merge);
                }
            }
            return json = $.extend(true, json, merge);
        });
        return json;
    };
})(jQuery);
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19418257

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档