Question

我有模型，就像这样：

defaults:{
    id:'',
    name: '',
    type: new typeCollection()
},
parse: function(response){
    var self = this;
    var typeCol = typeCollection;
    typeCol.fetch({ data: $.param({ id: response.id}),
        success: function (collection, response) {
            self.set('type', response);
        }}
    });
    return response; 
...

  console.log(model.attribute)
//{"id":"7","name":"myName","type":[{"tid": "2","tName": "myTName"},{"tid": "3","tName": "mOTName"}]}

查看：

Marionette.ItemView.extend({        
    template: _.template(myTpl),

    initialize: function(options){
        this.model = options.model;
        this.listenTo(this.model, 'change', this.render); 
    },      

    events:{
        "click #saveChanges":"saveIt"
    },      

    saveIt: function(e) {
        e.preventDefault();

        var form = this.$('#basic_info');
        var arr = form.serializeArray();
        var data = _(arr).reduce(function(acc, field) {

          acc[field.name] = field.value;
          return acc;
        }, {});         
        this.model.save(data);
console.log(data)//{"id":"7","name":"yourName","tName[0]": "myTName","tName[1]": "mOTName"}

模板：更新：为tName添加索引

<form id="basic_info">
    <input name="myName" value="<%= myName%>" type="text">

      <% _.each(type, function(item, index) { %> 
    <input name="tName[index]" value="<%= item.tName %>" type="text">
      <% }); %>
</form>

这有效，它可以满足输入字段。但我无法更新（save（））嵌套的“类型”集合。如何正确更新嵌套集合，而不是失去与其父模型的“连接”？

感谢您的回答和评论让我发挥作用，我不得不更改模板以及从表单中获取数据的方式。

这是解决方案：

模板：

<% _.each(type, function(item) { %>
   <div  data-nested="true" data-item-id="<%= item.tid %>" >
     <input  name="itemName" value="<%= item.tName %>" type="text">
   </div>
<% }); %>

查看：

//serialize only static part of the form
var rootInfo = _.object(_.map($('.serialize :input').serializeArray(), _.values))

var type= [];   

form.find('div[data-nested=true]').each(function(){
var self = $(this);     
  var tid    = self.data('item-id');
  var tName= self.find('input[name=itemName]').val();

     type.push({'tid'   :tid,
                'tName':tName })
 })

//merge basic info with type
_.extend(rootInfo , {type:type}) 

this.model.save(rootInfo);

Answer 1

表单只能有一个名称为tName / tid的字段，因此请尝试更改模板，例如

<form id="basic_info">
    <input name="myName" value="<%= myName%>" type="text">

      <% _.each(type, function(item) { %> 
    <input name="tName[]" value="<%= item.tName %>" type="text">
      <% }); %>
</form>

然后你就可以在保存

之前获取所有数据并使用它进行操作

您将在formData中获得一系列字段，因此您需要将所需字段设置为数组到模型字段。如果你需要代码示例 - 请在jsbin创建测试，给出链接 - 社区将添加代码

Backbone保存嵌套集合

1 个答案: