diff --git a/CHANGELOG.txt b/CHANGELOG.txt index b9bd53e..3cb54c2 100644 --- a/CHANGELOG.txt +++ b/CHANGELOG.txt @@ -4,6 +4,7 @@ X-editable changelog Version 1.5.1 wip ---------------------------- +[enh #400] allow `validate` to change submitted value (vitalets) [enh #396] bs3 popover: placement `auto` (vitalets) [bug #357] select2: tags mode with space separator (vitalets) [bug #374] dateui: clear button does not submit (vitalets) diff --git a/src/editable-form/editable-form.js b/src/editable-form/editable-form.js index a59d679..e391ef1 100644 --- a/src/editable-form/editable-form.js +++ b/src/editable-form/editable-form.js @@ -199,9 +199,18 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc. //get new value from input var newValue = this.input.input2value(); - // validation: if validate returns truthy value - means error + // validation: if validate returns string or truthy value - means error + // if returns object like {newValue: '...'} => submitted value is reassigned to it var error = this.validate(newValue); - if (error) { + if ($.type(error) === 'object' && error.newValue !== undefined) { + newValue = error.newValue; + this.input.value2input(newValue); + if(typeof error.msg === 'string') { + this.error(error.msg); + this.showForm(); + return; + } + } else if (error) { this.error(error); this.showForm(); return; @@ -500,6 +509,8 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc. send: 'auto', /** Function for client-side validation. If returns string - means validation not passed and string showed as error. + Since 1.5.1 you can modify submitted value by returning object from `validate`: + `{newValue: '...'}` or `{newValue: '...', msg: '...'}` @property validate @type function diff --git a/test/unit/api.js b/test/unit/api.js index 4958f1e..21298e3 100644 --- a/test/unit/api.js +++ b/test/unit/api.js @@ -446,11 +446,80 @@ $(function () { ok(!e.hasClass('editable-click'), 'editable-click class removed'); equal(e.text(), '', 'emptytext removed'); - - + e.click(); - }); + }); + + + asyncTest("'validate' that change value", function () { + expect(3); + + var e = $('<a href="#" data-type="text" data-pk="1" data-url="validate-change-ok" data-name="text">abc</a>').appendTo(fx).editable({ + validate: function(value) { + return {newValue: 'newval'}; + } + }); + + + $.mockjax({ + url: 'validate-change-ok', + response: function(settings) { + equal(settings.data.value, 'newval', 'validate-change-ok'); + this.responseText = ''; + } + }); + + //change value to pass client side validation + e.click(); + var p = tip(e); + p.find('input[type=text]').val('cde'); + p.find('button[type=submit]').click(); + + setTimeout(function() { + equal(e.data('editable').value, 'newval', 'new value saved'); + ok(!p.is(':visible'), 'popover closed'); + + e.remove(); + start(); + }, timeout); + + }); + asyncTest("'validate' that change value and shows message", function () { + expect(3); + + var e = $('<a href="#" data-type="text" data-url="validate-change-error" data-name="text">abc</a>').appendTo(fx).editable({ + validate: function(value) { + return {newValue: 'newval', msg: 'error!'}; + } + }); + + + $.mockjax({ + url: 'validate-change-error', + response: function(settings) { + ok(true, 'should not call'); + this.responseText = ''; + } + }); + + //change value to pass client side validation + e.click(); + var p = tip(e); + p.find('input[type=text]').val('cde'); + p.find('button[type=submit]').click(); + + setTimeout(function() { + ok(p.is(':visible'), 'popover visible'); + equal(p.find('input[type=text]').val(), 'newval', 'new value shown in input'); + equal(p.find('.editable-error-block').text(), 'error!', 'error msg shown'); + + e.remove(); + start(); + }, timeout); + + }); + });