diff --git a/dev.html b/dev.html
index d0eafd0..5e9f51d 100644
--- a/dev.html
+++ b/dev.html
@@ -34,6 +34,8 @@
+
+
diff --git a/docs/components/Params.vue b/docs/components/Params.vue
index 964db6c..60048f2 100644
--- a/docs/components/Params.vue
+++ b/docs/components/Params.vue
@@ -71,6 +71,16 @@
default: true
},
+ /**
+ * Close a dropdown when an option is chosen. Set to false to keep the dropdown
+ * open (useful when combined with multi-select, for example)
+ * @type {Boolean}
+ */
+ closeOnSelect: {
+ type: Boolean,
+ default: true
+ },
+
/**
* Tells vue-select what key to use when generating option labels when
* `option` is an object.
diff --git a/src/components/Select.vue b/src/components/Select.vue
index 56e35db..4d7ed22 100644
--- a/src/components/Select.vue
+++ b/src/components/Select.vue
@@ -390,6 +390,16 @@
default: true
},
+ /**
+ * Close a dropdown when an option is chosen. Set to false to keep the dropdown
+ * open (useful when combined with multi-select, for example)
+ * @type {Boolean}
+ */
+ closeOnSelect: {
+ type: Boolean,
+ default: true
+ },
+
/**
* Tells vue-select what key to use when generating option
* labels when each `option` is an object.
@@ -625,7 +635,7 @@
* @return {void}
*/
onAfterSelect(option) {
- if (!this.multiple) {
+ if (this.closeOnSelect) {
this.open = !this.open
this.$refs.search.blur()
}
diff --git a/test/unit/specs/Select.spec.js b/test/unit/specs/Select.spec.js
index bd5cff4..ba98bf5 100644
--- a/test/unit/specs/Select.spec.js
+++ b/test/unit/specs/Select.spec.js
@@ -351,6 +351,46 @@ describe('Select.vue', () => {
})
})
+
+ it('closes the dropdown when an option is selected, multiple is true, and closeOnSelect option is true', (done) => {
+ const vm = new Vue({
+ template: '
',
+ components: {vSelect},
+ data: {
+ value: [],
+ options: ['one', 'two', 'three']
+ }
+ }).$mount()
+
+ vm.$children[0].open = true
+ vm.$refs.select.select('one')
+
+ Vue.nextTick(() => {
+ expect(vm.$children[0].open).toEqual(false)
+ done()
+ })
+ })
+
+ it('does not close the dropdown when the el is clicked, multiple is true, and closeOnSelect option is false', (done) => {
+ const vm = new Vue({
+ template: '
',
+ components: {vSelect},
+ data: {
+ value: [],
+ options: ['one', 'two', 'three']
+ }
+ }).$mount()
+
+ vm.$children[0].open = true
+ vm.$refs.select.select('one')
+
+ Vue.nextTick(() => {
+ expect(vm.$children[0].open).toEqual(true)
+ done()
+ })
+ })
+
+
it('should close the dropdown on search blur', () => {
const vm = new Vue({
template: '
',