【问题标题】:How to delete a dependent model from the same collection in backbone.js如何从backbone.js中的同一集合中删除依赖模型
【发布时间】:2013-02-06 13:28:28
【问题描述】:

我有一个模型,它同时具有 navid 和 subnavid 。在销毁模型时,我需要检查整个集合,对于其他模型的 navid 与我要删除的模型的 subnavid 相同。请帮帮我。提前致谢 。这是我的示例代码。

型号:

var Node = Backbone.Model.extend({ 默认值:{ 导航标识:'', 子导航 ID:''。 项目名称:'' } }

收藏:

var NodeCollection = Backbone.Collection.extend({ model:Node }

我有两个视图,一个用于节点(我正在构建 tr),另一个用于 集合(我需要建表) var NodeCollectionView = Backbone.View.extend({

initialize: function (options) {
    var self = this;      self.collection = new NodeCollection({ NavigationId: options.NavigationId });
    self.collection.fetch({
        success: function () {
            /*I am getting  hte proper collection from my restful api and iam able to bind it properly
          self.render();
        }
    });
},

render: function () {
    var that = this;
    _.each(this.collection.models, function (item) {
        that.RenderEachNode(item);
    }, this);
},

RenderEachNode: function (item) {
    var TempJsonNode = item.toJSON();
    var self = this;
    var nodeView = new NodeView({
        tagName: 'tr',
        id: 'NavId_' + TempJsonNode.NavItemId,
        model: item
    });
} });
var ItemTemplate = ""; ItemTemplate += "    <td>"; ItemTemplate += "        <a><%= ItemName %></a>"; ItemTemplate +="   </td>"; ItemTemplate
+=" <td>"; ItemTemplate +="         <a href='#' original-title='Delete ' class='tip_north Delete'>X</a>"; ItemTemplate +="  </td>  ";           


var NavigationItemView = Backbone.View.extend({
    template: ItemTemplate,
    render: function () {
        var self = this;
        var tmpl = _.template(this.template);
        this.$el.html(tmpl(this.model.toJSON()));
        return this;
    },
    events: {
        "click .Delete": "DeleteBtnClick"
    },
    DeleteBtnClick: function () {
        var self = this;
        self.model.destroy({
            success: function (status, data) {
                var RetData = JSON.parse(data);
                if (RetData.Status == 'Success') {
                    $(self.el).remove()
                }
            },
            error: function () {
                alert('Error In Deleting The Record');
            }
        });
        return false;
    } });

我能够正确构建表,但是在销毁模型时,我没有找到销毁依赖模型的方法。我的 Api 受到限制,以至于我无法获得嵌套的 json(如果是这样,我会已经完成了骨干关系)。所以我需要找出一些方法来删除具有模型的 NavId 的其他模型和视图。

请帮帮我。

【问题讨论】:

    标签: backbone.js marionette backbone-views backbone-events backbone-relational


    【解决方案1】:

    怎么样:

    var NodeView = Backbone.View.extend({
      initialize: function() {
        //when the model gets destroyed, remove the view
        this.listenTo(this.model, 'destroy', this.remove);
      },
      //..clip
      DeleteBtnClick: function () {
        var self = this;
        var collection = self.model.collection;
        var navId = self.model.get('NavId');
    
        self.model.destroy({
          success: function (status, data) {
            var RetData = JSON.parse(data);
            if (RetData.Status == 'Success') {
              //if parent was part of a collection
              if (collection) {
                //find related models
                var related = collection.filter(function (model) {
                  return model.get('SubNavId') === navId;
                });
    
                //call destroy for each related model.
                var promises = _.invoke(related, 'destroy');
    
                //optional: if you want to do something when all the children
                //are destroyed:
                $.when.apply($, promises).then(function () {
                  console.log('all destroyed');
                });
              }
            }
          },
          error: function () {
            console.log(arguments);
            alert('Error In Deleting The Record');
          }
        });
        return false;
      }
    });
    

    编辑: JSFiddle here

    【讨论】:

    • 嗨,Fencliff,我是主干 js 的新手,我会准备一个 quik fiddle,你能修改一下并给我看吗?
    • @ArunKumar,我可以看看。如果我能在短时间内完成,我会的。
    • @ArunKumar,JSFiddle 真的很慢。等我有空的时候再看看。
    • @ArunKumar,在帖子中添加了一个小提琴并更新了代码。希望这会有所帮助。
    • 我无法在小提琴中找到任何更改
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多