FIX Only allow one concurrent ajax in TreeDropdownField

Prevents situations where a previous action might finish out of line
and override later choices, such as first expanding the (full) tree panel,
then limiting the tree through searching.
This commit is contained in:
Ingo Schommer 2013-04-05 00:01:21 +02:00 committed by Will Rossiter
parent da87614d8f
commit 5119d9aa72

View File

@ -29,6 +29,10 @@
* @todo Expand title height to fit all elements * @todo Expand title height to fit all elements
*/ */
$('.TreeDropdownField').entwine({ $('.TreeDropdownField').entwine({
// XMLHttpRequest
CurrentXhr: null,
onadd: function() { onadd: function() {
this.append( this.append(
'<span class="treedropdownfield-title"></span>' + '<span class="treedropdownfield-title"></span>' +
@ -70,7 +74,7 @@
.removeClass('ui-icon-triangle-1-s') .removeClass('ui-icon-triangle-1-s')
.addClass('ui-icon-triangle-1-n'); .addClass('ui-icon-triangle-1-n');
if(tree.is(':empty')) this.loadTree(); if(tree.is(':empty') && !panel.hasClass('loading')) this.loadTree();
this.trigger('panelshow'); this.trigger('panelshow');
}, },
closePanel: function() { closePanel: function() {
@ -131,13 +135,21 @@
return this.find(':input:hidden').val(); return this.find(':input:hidden').val();
}, },
loadTree: function(params, callback) { loadTree: function(params, callback) {
var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder'); var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder'),
var params = (params) ? $.extend({}, this.getRequestParams(), params) : this.getRequestParams(); params = (params) ? $.extend({}, this.getRequestParams(), params) : this.getRequestParams(), xhr;
if(this.getCurrentXhr()) this.getCurrentXhr().abort();
panel.addClass('loading'); panel.addClass('loading');
treeHolder.load(this.data('urlTree'), params, function(html, status, xhr) { xhr = $.ajax({
url: this.data('urlTree'),
data: params,
complete: function(xhr, status) {
panel.removeClass('loading');
},
success: function(html, status, xhr) {
treeHolder.html(html);
var firstLoad = true; var firstLoad = true;
if(status == 'success') { treeHolder
$(this)
.jstree('destroy') .jstree('destroy')
.bind('loaded.jstree', function(e, data) { .bind('loaded.jstree', function(e, data) {
var val = self.getValue(), selectNode = treeHolder.find('*[data-id="' + val + '"]'), var val = self.getValue(), selectNode = treeHolder.find('*[data-id="' + val + '"]'),
@ -163,12 +175,13 @@
// Avoid auto-closing panel on first load // Avoid auto-closing panel on first load
if(!firstLoad) self.closePanel(); if(!firstLoad) self.closePanel();
firstLoad=false firstLoad=false;
}); });
}
panel.removeClass('loading'); self.setCurrentXhr(null);
}
}); });
this.setCurrentXhr(xhr);
}, },
getTreeConfig: function() { getTreeConfig: function() {
var self = this; var self = this;
@ -311,12 +324,21 @@
}, },
loadTree: function(params, callback) { loadTree: function(params, callback) {
var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder'); var self = this, panel = this.getPanel(), treeHolder = $(panel).find('.tree-holder');
var params = (params) ? $.extend({}, this.getRequestParams(), params) : this.getRequestParams(); var params = (params) ? $.extend({}, this.getRequestParams(), params) : this.getRequestParams(), xhr;
if(this.getCurrentXhr()) this.getCurrentXhr().abort();
panel.addClass('loading'); panel.addClass('loading');
treeHolder.load(this.data('urlTree'), params, function(html, status, xhr) { xhr = $.ajax({
url: this.data('urlTree'),
data: params,
complete: function(xhr, status) {
panel.removeClass('loading');
},
success: function(html, status, xhr) {
treeHolder.html(html);
var firstLoad = true; var firstLoad = true;
if(status == 'success') { self.setCurrentXhr(null);
$(this) treeHolder
.jstree('destroy') .jstree('destroy')
.bind('loaded.jstree', function(e, data) { .bind('loaded.jstree', function(e, data) {
$.each(self.getValue(), function(i, val) { $.each(self.getValue(), function(i, val) {
@ -339,9 +361,8 @@
})); }));
}); });
} }
panel.removeClass('loading');
}); });
this.setCurrentXhr(xhr);
}, },
getValue: function() { getValue: function() {
var val = this._super(); var val = this._super();