If true, the dropdown will be closed after a selection is made.
+
boolean
+
false
+
allowEmptyOption
If true, Selectize will treat any options with a "" value like normal. This defaults to false to accomodate the common <select> practice of having the first empty option act as a placeholder.
diff --git a/src/defaults.js b/src/defaults.js
index f6d616af1..04556cde3 100644
--- a/src/defaults.js
+++ b/src/defaults.js
@@ -20,6 +20,7 @@ Selectize.defaults = {
selectOnTab: false,
preload: false,
allowEmptyOption: false,
+ closeAfterSelect: false,
scrollDuration: 60,
loadThrottle: 300,
diff --git a/src/selectize.js b/src/selectize.js
index 20f3b88e7..d9df9bca6 100644
--- a/src/selectize.js
+++ b/src/selectize.js
@@ -666,14 +666,20 @@ $.extend(Selectize.prototype, {
$target = $(e.currentTarget);
if ($target.hasClass('create')) {
- self.createItem();
+ self.createItem(null, function() {
+ if (self.settings.closeAfterSelect) {
+ self.close();
+ }
+ });
} else {
value = $target.attr('data-value');
if (typeof value !== 'undefined') {
self.lastQuery = null;
self.setTextboxValue('');
self.addItem(value);
- if (!self.settings.hideSelected && e.type && /mouse/.test(e.type)) {
+ if (self.settings.closeAfterSelect) {
+ self.close();
+ } else if (!self.settings.hideSelected && e.type && /mouse/.test(e.type)) {
self.setActiveOption(self.getOption(value));
}
}
diff --git a/test/interaction.js b/test/interaction.js
index 319845781..fe9ccca27 100644
--- a/test/interaction.js
+++ b/test/interaction.js
@@ -12,6 +12,36 @@
describe('Interaction', function() {
+ it('should keep dropdown open after selection made if closeAfterSelect: false', function(done) {
+ var test = setup_test('', {});
+
+ click(test.selectize.$control, function() {
+ click($('[data-value=a]', test.selectize.$dropdown_content), function() {
+ expect(test.selectize.isOpen).to.be.equal(true);
+ expect(test.selectize.isFocused).to.be.equal(true);
+ done();
+ });
+ });
+ });
+
+ it('should close dropdown after selection made if closeAfterSelect: true', function(done) {
+ var test = setup_test('', {closeAfterSelect: true});
+
+ click(test.selectize.$control, function() {
+ click($('[data-value=a]', test.selectize.$dropdown_content), function() {
+ expect(test.selectize.isOpen).to.be.equal(false);
+ expect(test.selectize.isFocused).to.be.equal(true);
+ done();
+ });
+ });
+ });
+
describe('clicking control', function() {
it('should give it focus', function(done) {