Spree.Views.Stock.EditStockItemRow = Backbone.View.extend({ tagName: 'tr', initialize: function(options) { this.stockLocationName = options.stockLocationName; this.negative = this.model.attributes.count_on_hand < 0; this.previousAttributes = _.clone(this.model.attributes); this.listenTo(this.model, 'sync', this.onSuccess); this.render(); }, events: { "click .submit": "onSubmit", "submit form": "onSubmit", "click .cancel": "onCancel", 'input [name="count_on_hand"]': "countOnHandChanged", 'input [name="backorderable"]': "backorderableChanged" }, template: HandlebarsTemplates['stock_items/stock_location_stock_item'], render: function() { var renderAttr = { stockLocationName: this.stockLocationName, editing: this.editing, negative: this.negative }; _.extend(renderAttr, this.model.attributes); this.$el.attr("data-variant-id", this.model.get('variant_id')); this.$el.html(this.template(renderAttr)); this.$count_on_hand_display = this.$('.count-on-hand-display'); return this; }, onEdit: function(ev) { ev.preventDefault(); this.render(); }, onCancel: function(ev) { ev.preventDefault(); this.model.set(this.previousAttributes); this.$el.removeClass('changed'); this.render(); }, onChange: function() { var count_on_hand_changed = this.previousAttributes.count_on_hand != this.model.attributes.count_on_hand; var backorderable_changed = this.previousAttributes.backorderable != this.model.attributes.backorderable; var changed = count_on_hand_changed || backorderable_changed; this.$el.toggleClass('changed', changed); }, backorderableChanged: function(ev) { this.model.set("backorderable", ev.target.checked); this.onChange(); }, countOnHandChanged: function(ev) { var diff = parseInt(ev.currentTarget.value), newCount; if (isNaN(diff)) diff = 0; newCount = this.previousAttributes.count_on_hand + diff; ev.preventDefault(); // Do not allow negative stock values if (newCount < 0) { ev.currentTarget.value = -1 * this.previousAttributes.count_on_hand; this.$count_on_hand_display.text(0); } else { this.model.set("count_on_hand", newCount); this.$count_on_hand_display.text(newCount); } this.onChange(); }, onSuccess: function() { this.$el.removeClass('changed'); this.previousAttributes = _.clone(this.model.attributes); this.render(); this.$('[name="count_on_hand"]').focus(); }, onError: function(model, response, options) { show_flash("error", response.responseText); }, onSubmit: function(ev) { ev.preventDefault(); var backorderable = this.$('[name=backorderable]').prop("checked"); var countOnHand = parseInt(this.$("input[name='count_on_hand']").val(), 10); this.model.set({ count_on_hand: countOnHand, backorderable: backorderable }); var options = { success: function() { show_flash("success", Spree.translations.updated_successfully); }, error: this.onError.bind(this) }; this.model.save({}, options); } });