收集中的更改事件是否也不应该触发模型上的更改事件?

时间:2013-08-20 12:40:15

标签: javascript backbone.js

当我在我的收藏中运行add时:

this.children.add(newData,{merge:true});

集合的更改事件触发并告诉我已更改的模型。但是,已更改的模型不会触发更改事件。我认为如果模型发生变化,它将触发一个变化事件。

在单个项目视图中,我有(ChildView.js):

initalize: function(){
    this.listenTo(this.model, 'change',this.render);
},

在视图中我拥有的所有项目(ChildrenView.js):

this.listenTo(this.children, 'change', this.changed);

所以this.changed开火了。但是有问题的模型没有触发change event

我正在进行ajax文件上传,因为现在缺少更好的方法我只是使用ajax调用来上传文件(请参阅设置集合的成功函数):

    getFile:function(e){
        e.preventDefault();
        var that = this;
        var collChildren = this.children;
        console.log('this',this);
        console.log(this.children);
        var file = e.target.files[0];
        var formData = new FormData($('#upload-child-pic-form')[0]);
        console.log(this,'currentUploadU',this.currentUpload);
        formData.append('child_id',this.currentUpload);
        $.ajax({
            url: '/x/children/upload/',  //Server script to process data
            type: 'POST',
            xhr: function() {  // Custom XMLHttpRequest
            var myXhr = $.ajaxSettings.xhr();
                if(myXhr.upload){ // Check if upload property exists
                    myXhr.upload.addEventListener('progress',function(data){
                        $("#upload-child-pic-progress").val(data.position / data.totalSize * 100);
                    }, false); // For handling the progress of the upload
                }
                return myXhr;
            },
            //Ajax events
            beforeSend: function(data){
                $("#upload-child-pic-progress").removeClass('hide');
            },
            success: function(data){
                $("#upload-child-pic-progress").addClass('hide');
                $("#add-child-profile-pics-modal").modal('hide');
                var newData = $.parseJSON(data);
                collChildren.add(newData,{merge:true});
            },
            error: function(data){
                console.log('error',data);
            },
            // Form data
            data: formData,
            //Options to tell jQuery not to process data or worry about content-type.
            cache: false,
            contentType: false,
            processData: false
        });
    },

这是我的单Child视图

define([
'jquery',
'underscore',
'backbone',
'text!templates/children/child.html'
], function($,_,Backbone,childTemplate){
var ChildView = Backbone.View.extend({
    tagName: 'li',

    events: {
        'click .pic-settings'   : 'picSettingsClicked',
    },

    template: _.template(childTemplate),

    initalize: function(){
        this.listenTo(this.model, 'change',this.render);
    },

    picSettingsClicked: function(e){
        e.preventDefault();
        Backbone.pubsub.trigger('picSettingClick',this.model.get('id'));
    },

    render: function(){
        console.log('changing',this.model,this.model.get('photo'),this.model.get('first_name'));
        this.$el.addClass('child').html(this.template(this.model.toJSON()));
        return this;
    }
}); 
return ChildView;
});

0 个答案:

没有答案