diff --git a/CHANGELOG.txt b/CHANGELOG.txt index 8257188..ee0d897 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -1,5 +1,10 @@ X-editable changelog ============================= + + +Version 1.1.1 wip +---------------------------- +[enh] success callback can return object to overwrite submitted value (vitalets) Version 1.1.0 Nov 27, 2012 diff --git a/src/editable-form/editable-form.js b/src/editable-form/editable-form.js index b6f8018..90e96f9 100644 --- a/src/editable-form/editable-form.js +++ b/src/editable-form/editable-form.js @@ -177,13 +177,20 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'. //sending data to server $.when(this.save(newValueStr)) .done($.proxy(function(response) { - var error; - //call success callback. if it returns string --> show error - if(error = this.options.success.call(this, response, newValue)) { - this.error(error); + //run success callback + var res = typeof this.options.success === 'function' ? this.options.success.call(this, response, newValue) : null; + + //if it returns string --> show error + if(res && typeof res === 'string') { + this.error(res); this.showForm(); return; - } + } + + //if it returns object like {newValue: <something>} --> use that value + if(res && typeof res === 'object' && res.hasOwnProperty('newValue')) { + newValue = res.newValue; + } //clear error message this.error(false); @@ -398,9 +405,13 @@ Editableform is linked with one of input types, e.g. 'text' or 'select'. **/ validate: null, /** - Success callback. Called when value successfully sent on server and response status = 200. - Can be used to process json response. If this function returns string - means error occured and string is shown as error message. - + Success callback. Called when value successfully sent on server and **response status = 200**. + Usefull to work with json response. For example, if your backend response can be <code>{success: true}</code> + or <code>{success: false, msg: "server error"}</code> you can check it inside this callback. + If it returns **string** - means error occured and string is shown as error message. + If it returns **object like** <code>{newValue: <something>}</code> - it overwrites value, submitted by user. + Otherwise newValue simply rendered into element. + @property success @type function @default null diff --git a/test/loader.js b/test/loader.js index ba91063..b1b4a6b 100644 --- a/test/loader.js +++ b/test/loader.js @@ -80,8 +80,7 @@ function getAssets(f, c, src, libs) { //core js.unshift(bootstrap+'js/bootstrap.js') css.unshift(bootstrap+'css/bootstrap.css'); -// css.push(bootstrap+'css/bootstrap.css'); - //css.unshift(bootstrap+'css/bootstrap-responsive.css'); + css.unshift(bootstrap+'css/bootstrap-responsive.css'); //editable js.push(forms+'editable-form-bootstrap.js'); diff --git a/test/unit/text.js b/test/unit/text.js index 79f1b90..538e786 100644 --- a/test/unit/text.js +++ b/test/unit/text.js @@ -211,7 +211,38 @@ $(function () { start(); }, timeout); - }); + }); + + asyncTest("should show new value if success callback returns object", function () { + var newText = 'cd<e>;"', + e = $('<a href="#" data-pk="1" data-url="post.php" data-name="text1">abc</a>').appendTo(fx).editable({ + success: function(response, newValue) { + equal(newValue, newText, 'value in success passed correctly'); + return {newValue: 'xyz'}; + } + }); + + e.click() + var p = tip(e); + + ok(p.find('input[type=text]').length, 'input exists') + p.find('input').val(newText); + p.find('form').submit(); + + setTimeout(function() { + ok(!p.is(':visible'), 'popover closed'); + equal(p.find('.editable-error-block').text(), '', 'no error msg'); + equal(e.data('editable').value, 'xyz', 'value ok'); + equal(e.text(), 'xyz', 'text ok'); + + p.find('button[type=button]').click(); + ok(!p.is(':visible'), 'popover was removed'); + e.remove(); + start(); + }, timeout); + + }); + asyncTest("should submit all required params", function () { var e = $('<a href="#" data-pk="1" data-url="post-resp.php">abc</a>').appendTo(fx).editable({