0

我有一个名为 DeliveryList 的交付模型集合。当我添加或编辑交付时，之前添加或编辑的交付的所有属性都会被新交付的属性覆盖。

奇怪的是，如果我在使用这行代码保存模型后重新加载页面：

// Hacky way to get around the models overwriting each other
location.reload();

该模型不会被新创建或编辑的模型覆盖。

关于为什么会发生这种情况的任何想法？

这是我的其余代码：

var DeliveryView = Marionette.ItemView.extend({
    initialize: function () {
        this.listenTo(this.model, 'change', this.render);
        this.listenTo(this.model, 'destroy', this.remove);
        _.bindAll(this, "editDeliveryOption", "saveAllFields");
    },

    onRender: function() {
        if (this.model.isNew()) {
            this.editDeliveryOption();
            this.$el.addClass("new");
        }
    },

    template: "#delivery-item-template",

    events: {
        "click #removeThis": "removeDeliveryOption",
        "click #editThis": "editDeliveryOption"
    },

    saveAllFields: function() {
        var value = $("#optionName input").val();
        this.model.save({ optionName: value });

        var value = $("#shipToState option:selected").val();
        this.model.save({ shipToState: value });

        var value = $("#zipCodes input").val();
        this.model.save({ zipCodes: value });

        var value = $("#perOrderFee input").val();
        this.model.save({ perOrderFee: value });

        var value = $("#perItemFee input").val();
        this.model.save({ perItemFee: value });

        // After done editing, remove the view from the dom
        this.editDeliveryForm.remove();

        // Show the new option
        this.$el.removeClass("new");

        // Hacky way to get around the models overwriting each other
        location.reload();
    },

    editDeliveryOption: function () {
        this.editDeliveryForm = new Backbone.Form({
            template: _.template($("#editDeliveryTemplate").html()),
            model: this.model
        }).render();

        layout.editDelivery.show(this.editDeliveryForm);

        $("#triggerEditDelivery").fancybox({
            'afterClose': this.saveAllFields,
        }).click();

        // This button in Fancybox isn't working
        $("#saveDelivery").click(function() {
            this.saveAllFields;
        });
    },

    removeDeliveryOption: function () {
        this.model.destroy();
    }
});

var DeliveriesView = Marionette.CompositeView.extend({
    initialize: function () {
        this.collection.fetch();
        this.listenTo(this.collection, 'change', this.changThis);
    },

    changeThis: function () {
        alert("it changed");
    },

    template: "#deliveries-view-template",

    itemView: DeliveryView,

    events: {
        "click #addShipping": "addDeliveryOption",
    },

    addDeliveryOption: function() {
        this.collection.create();
    },

    // Specify a jQuery selector to put the itemView instances in to
    itemViewContainer: "#deliveries",
});
4

1 回答 1

0

感谢 EmptyArsenal 和 mu 太短了，无法为我指明正确的方向。

最终成为问题的是fancybox调用：

    $("#triggerEditDelivery").fancybox({
        'afterClose': this.saveAllFields,
    }).click();

每次我添加一个新字段时，它都会将 saveAllFields 方法调用绑定到#triggerEditDelivery。因此，每次我单击#triggerEditDelivery 进行新的交付时，它都会将它们全部保存到当前打开的交付中。

这是我的修复：

        $("#triggerEditDelivery").fancybox({
            helpers: {
                overlay: { closeClick: false }
            }
        }).click();

        $("#saveDelivery").click(this.saveAllFields);
        $("#cancelDelivery").click(this.cancelDeliveryOption);
于 2013-10-04T02:18:40.763 回答