Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Added a throttle on mousedown preveting the dropdown from reopening after click to close #1837

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Jul 29, 2022
Merged

Added a throttle on mousedown preveting the dropdown from reopening after click to close #1837

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions docs/usage.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,6 +141,12 @@ $(function() {
<td valign="top"><code>boolean</code></td>
<td valign="top"><code>false</code></td>
</tr>
<tr>
<td valign="top"><code>closeDropdownThreshold</code></td>
<td valign="top">The number of milliseconds to throttle the opening of the dropdown after it is closed by clicking on the control. Setting this to 0 will reopen the dropdown after clicking on the control when the dropdown is open. This does not affect multi-selects.</td>
<td valign="top"><code>int</code></td>
<td valign="top"><code>250</code></td>
</tr>
<tr>
<td valign="top"><code>allowEmptyOption</code></td>
<td valign="top">If true, Selectize will treat any options with a "" value like normal. This defaults to false to accomodate the common &lt;select&gt; practice of having the first empty option to act as a placeholder.</td>
Expand Down
1 change: 1 addition & 0 deletions src/defaults.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ Selectize.defaults = {
showEmptyOptionInDropdown: false,
emptyOptionLabel: '--',
closeAfterSelect: false,
closeDropdownThreshold: 250, // number of ms to prevent reopening of dropdown after mousedown

scrollDuration: 60,
deselectBehavior: 'previous', //top, previous
Expand Down
16 changes: 16 additions & 0 deletions src/selectize.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,7 @@ var Selectize = function($input, settings) {
caretPos : 0,
loading : 0,
loadedSearches : {},
isDropdownClosing: false,

$activeOption : null,
$activeItems : [],
Expand Down Expand Up @@ -368,6 +369,12 @@ $.extend(Selectize.prototype, {
onClick: function(e) {
var self = this;

// if the dropdown is closing due to a mousedown, we don't want to
// refocus the element.
if (self.isDropdownClosing) {
return;
}

// necessary for mobile webkit devices (manual focus triggering
// is ignored unless invoked within a click event)
// also necessary to reopen a dropdown that has been closed by
Expand Down Expand Up @@ -398,6 +405,15 @@ $.extend(Selectize.prototype, {
if (self.settings.mode === 'single') {
// toggle dropdown
self.isOpen ? self.close() : self.open();

// when closing the dropdown, we set a isDropdownClosing
// varible temporaily to prevent the dropdown from reopening
// from the onClick event
self.isDropdownClosing = true;
setTimeout(function() {
self.isDropdownClosing = false;
}, self.settings.closeDropdownThreshold);

} else if (!defaultPrevented) {
self.setActiveItem(null);
}
Expand Down