0

当我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;
});
4

0 回答 0