added `do not close popup when it is saving value, fix

This commit is contained in:
vitalets 2013-06-15 20:58:36 +04:00
parent 025c4c20cb
commit 9cbcb0e99c
4 changed files with 58 additions and 2 deletions

@ -3,6 +3,7 @@ X-editable changelog
Version 1.4.5 wip
----------------------------
[bug #224] do not close popup when it is saving value (vitalets)
[enh] added `submitValue` to `save` event params (vitalets)
[enh #259] allow `getValue` method to return value itself, not object (vitalets)
[enh] add `destroy` method to inputs (vitalets)

@ -33,6 +33,9 @@ Applied as jQuery method.
this.formOptions.scope = this.$element[0];
this.initContainer();
//flag to hide container, when saving value will finish
this.delayedHide = false;
//bind 'destroyed' listener to destroy container when element is removed from dom
this.$element.on('destroyed', $.proxy(function(){
@ -137,7 +140,14 @@ Applied as jQuery method.
save: $.proxy(this.save, this), //click on submit button (value changed)
nochange: $.proxy(function(){ this.hide('nochange'); }, this), //click on submit button (value NOT changed)
cancel: $.proxy(function(){ this.hide('cancel'); }, this), //click on calcel button
show: $.proxy(this.setPosition, this), //re-position container every time form is shown (occurs each time after loading state)
show: $.proxy(function() {
if(this.delayedHide) {
this.hide(this.delayedHide.reason);
this.delayedHide = false;
} else {
this.setPosition();
}
}, this), //re-position container every time form is shown (occurs each time after loading state)
rendering: $.proxy(this.setPosition, this), //this allows to place container correctly when loading shown
resize: $.proxy(this.setPosition, this), //this allows to re-position container when form size is changed
rendered: $.proxy(function(){
@ -218,6 +228,14 @@ Applied as jQuery method.
return;
}
//if form is saving value, schedule hide
if(this.$form.data('editableform').isSaving) {
this.delayedHide = {reason: reason};
return;
} else {
this.delayedHide = false;
}
this.$element.removeClass('editable-open');
this.innerHide();
@ -293,7 +311,7 @@ Applied as jQuery method.
**/
this.$element.triggerHandler('save', params);
//hide must be after trigger, as saving value may require methods od plugin, applied to input
//hide must be after trigger, as saving value may require methods of plugin, applied to input
this.hide('save');
},

@ -60,6 +60,10 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
//show loading state
this.showLoading();
//flag showing is form now saving value to server.
//It is needed to wait when closing form.
this.isSaving = false;
/**
Fired when rendering starts
@event rendering
@ -215,9 +219,13 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
//convert value for submitting to server
var submitValue = this.input.value2submit(newValue);
this.isSaving = true;
//sending data to server
$.when(this.save(submitValue))
.done($.proxy(function(response) {
this.isSaving = false;
//run success callback
var res = typeof this.options.success === 'function' ? this.options.success.call(this.options.scope, response, newValue) : null;
@ -261,6 +269,8 @@ Editableform is linked with one of input types, e.g. 'text', 'select' etc.
this.$div.triggerHandler('save', {newValue: newValue, submitValue: submitValue, response: response});
}, this))
.fail($.proxy(function(xhr) {
this.isSaving = false;
var msg;
if(typeof this.options.error === 'function') {
msg = this.options.error.call(this.options.scope, xhr, newValue);

@ -180,6 +180,33 @@ $(function () {
}, timeout);
});
asyncTest("hide when saving value", function () {
var newVal = 2,
e = $('<a href="#" data-pk="1" data-type="select" data-url="post.php" data-name="text" data-value="1"></a>')
.appendTo(fx)
.editable({
source: groupsArr
});
e.click();
var p = tip(e);
p.find('select').val(2);
p.find('form').submit();
e.parent().click();
ok(p.is(':visible'), 'popover still visible');
setTimeout(function() {
equal(e.data('editable').value, newVal, 'new value saved');
ok(!p.is(':visible'), 'popover closed');
e.remove();
start();
}, timeout);
});
test("show/hide/toggle methods", function () {
var e = $('<a href="#" data-pk="1" data-url="post.php" data-name="text1">abc</a>').appendTo('#qunit-fixture').editable();
e.editable('show');