1
0
mirror of synced 2024-11-26 06:46:04 +03:00

use the dropdown mask to close open flyouts instead of a global listener. also move the original element off screen instead of hiding it so clicking a label focuses select2 instance

This commit is contained in:
Igor Vaynberg 2013-01-31 23:58:42 -08:00
parent c66a91a9bb
commit 76295bb5e9

View File

@ -476,39 +476,6 @@ the specific language governing permissions and limitations under the Apache Lic
if (original!==input) return input; if (original!==input) return input;
} }
/**
* blurs any Select2 container that has focus when an element outside them was clicked or received focus
*
* also takes care of clicks on label tags that point to the source element
*/
$document.ready(function () {
$document.bind("mousedown touchend", function (e) {
var target = $(e.target).closest("div.select2-container").get(0), attr;
var targetDropdown = null;
if (target && $(target).data("select2") ) {
$document.find("div.select2-container-active").each(function () {
if (this !== target) $(this).data("select2").blur();
});
targetDropdown = $(target).data('select2').dropdown.get(0);
}
// close any other active dropdowns
target = targetDropdown || $(e.target).closest("div.select2-drop").get(0);
$document.find("div.select2-drop-active").each(function () {
if (this !== target) $(this).data("select2").blur();
});
target=$(e.target);
attr = target.attr("for");
if ("LABEL" === e.target.tagName && attr && attr.length > 0) {
attr = attr.replace(/([\[\].])/g,'\\$1'); /* escapes [, ], and . so properly selects the id */
target = $("#"+attr);
target = target.data("select2");
if (target !== undefined && target !== null) { target.focus(); e.preventDefault();}
}
});
});
/** /**
* Creates a new class * Creates a new class
* *
@ -566,6 +533,12 @@ the specific language governing permissions and limitations under the Apache Lic
mask.attr("id","select2-drop-mask").attr("class","select2-drop-mask"); mask.attr("id","select2-drop-mask").attr("class","select2-drop-mask");
mask.hide(); mask.hide();
mask.appendTo(this.body()); mask.appendTo(this.body());
mask.bind("mousedown touchstart", function (e) {
var dropdown = $("#select2-drop");
if (dropdown.length > 0) {
dropdown.data("select2").close();
}
});
} }
if (opts.element.attr("class") !== undefined) { if (opts.element.attr("class") !== undefined) {
@ -575,10 +548,14 @@ the specific language governing permissions and limitations under the Apache Lic
this.container.css(evaluate(opts.containerCss)); this.container.css(evaluate(opts.containerCss));
this.container.addClass(evaluate(opts.containerCssClass)); this.container.addClass(evaluate(opts.containerCssClass));
this.elementTabIndex = this.opts.element.attr("tabIndex");
// swap container for the element // swap container for the element
this.opts.element this.opts.element
.data("select2", this) .data("select2", this)
.hide() .addClass("select2-offscreen")
.bind("focus.select2", function() { $(this).select2("focus")})
.attr("tabIndex", "-1")
.before(this.container); .before(this.container);
this.container.data("select2", this); this.container.data("select2", this);
@ -589,7 +566,7 @@ the specific language governing permissions and limitations under the Apache Lic
this.results = results = this.container.find(resultsSelector); this.results = results = this.container.find(resultsSelector);
this.search = search = this.container.find("input.select2-input"); this.search = search = this.container.find("input.select2-input");
search.attr("tabIndex", this.opts.element.attr("tabIndex")); search.attr("tabIndex", this.elementTabIndex);
this.resultsPage = 0; this.resultsPage = 0;
this.context = null; this.context = null;
@ -659,6 +636,7 @@ the specific language governing permissions and limitations under the Apache Lic
select2.opts.element select2.opts.element
.removeData("select2") .removeData("select2")
.unbind(".select2") .unbind(".select2")
.attr("tabIndex", this.elementTabIndex)
.show(); .show();
} }
}, },
@ -1547,7 +1525,7 @@ the specific language governing permissions and limitations under the Apache Lic
if (!this.opened()) this.container.removeClass("select2-container-active"); if (!this.opened()) this.container.removeClass("select2-container-active");
window.setTimeout(this.bind(function() { window.setTimeout(this.bind(function() {
// restore original tab index // restore original tab index
var ti=this.opts.element.attr("tabIndex") || 0; var ti=this.elementTabIndex || 0;
if (ti) { if (ti) {
this.selection.attr("tabIndex", ti); this.selection.attr("tabIndex", ti);
} else { } else {
@ -1590,7 +1568,7 @@ the specific language governing permissions and limitations under the Apache Lic
if (!this.opened()) { if (!this.opened()) {
this.container.removeClass("select2-container-active"); this.container.removeClass("select2-container-active");
} }
window.setTimeout(this.bind(function() { this.search.attr("tabIndex", this.opts.element.attr("tabIndex") || 0); }), 10); window.setTimeout(this.bind(function() { this.search.attr("tabIndex", this.elementTabIndex || 0); }), 10);
})); }));
selection.bind("keydown", this.bind(function(e) { selection.bind("keydown", this.bind(function(e) {