From a7c8514c123ae61b084b703098acc1cadd275f2e Mon Sep 17 00:00:00 2001 From: kamilogorek Date: Thu, 31 Oct 2013 00:52:06 +0100 Subject: [PATCH] Backbone input value trimming on edit --- .../backbone/js/views/todo-view.js | 11 +++++++++-- .../backbone_require/js/views/todos.js | 16 ++++++++++++---- 2 files changed, 21 insertions(+), 6 deletions(-) diff --git a/architecture-examples/backbone/js/views/todo-view.js b/architecture-examples/backbone/js/views/todo-view.js index ed0a0f1a3c..5e31afdf2a 100644 --- a/architecture-examples/backbone/js/views/todo-view.js +++ b/architecture-examples/backbone/js/views/todo-view.js @@ -67,11 +67,18 @@ var app = app || {}; // Close the `"editing"` mode, saving changes to the todo. close: function () { - var trimmedValue = this.$input.val().trim(); - this.$input.val(trimmedValue); + var value = this.$input.val(); + var trimmedValue = value.trim(); if (trimmedValue) { this.model.save({ title: trimmedValue }); + + if (value !== trimmedValue) { + // Model values changes consisting of whitespaces only are not causing change to be triggered + // Therefore we've to compare untrimmed version with a trimmed one to chech whether anything changed + // And if yes, we've to trigger change event ourselves + this.model.trigger('change'); + } } else { this.clear(); } diff --git a/dependency-examples/backbone_require/js/views/todos.js b/dependency-examples/backbone_require/js/views/todos.js index c14368dd5e..02859c171b 100644 --- a/dependency-examples/backbone_require/js/views/todos.js +++ b/dependency-examples/backbone_require/js/views/todos.js @@ -67,10 +67,18 @@ define([ // Close the `"editing"` mode, saving changes to the todo. close: function () { - var value = this.$input.val().trim(); - - if (value) { - this.model.save({ title: value }); + var value = this.$input.val(); + var trimmedValue = value.trim(); + + if (trimmedValue) { + this.model.save({ title: trimmedValue }); + + if (value !== trimmedValue) { + // Model values changes consisting of whitespaces only are not causing change to be triggered + // Therefore we've to compare untrimmed version with a trimmed one to chech whether anything changed + // And if yes, we've to trigger change event ourselves + this.model.trigger('change'); + } } else { this.clear(); }