Comments (6)
I'd also like to know how to stop this if possible.
Im using it with livewire and allowing multiple selections.
When you select an option after searching it is breaking the rule that selections should be an array as on the first change event the value is a string (the search term), and immediately after that the change event is triggered again with the selected values as an array.
from virtual-select.
I have made a hotfix for it. I'm using this with jQuery event listeners.
$(document).on("change", ".foo", function (e) {
if (virtualSelectFix($(this), e)) {
return;
}
})
function virtualSelectFix(that, event) {
if (that.val() !== event.target.value) {
return true;
}
return false;
}
from virtual-select.
@sa-si-dev could you help clarifying this?
from virtual-select.
This is still causing some issues.
When you search and hit enter, the value passed is the string you searched, and not the option you selected.
@sa-si-dev Could you help please 🙏
from virtual-select.
I can confirm the search value is being passed back as the value before the selected value/s. I have this setup as a Livewire component and have managed to ignore the search value for now, but as I'm not using onServerSearch there's no need for the search value to be passed back at all.
from virtual-select.
@rich1888, I am also using this as a livewire component but I have it setup as a reusable component using livewire/livewire#4725 as my starting point.
Technically, the search input is changing, but I have tweaked the x-on:change attribute to only set the model value (and as a result, trigger a livewire update) if the className is "vscomp-ele pop-comp-ele pop-comp-active" or "vscomp-ele pop-comp-ele":
original:
'x-on:change="select = event.target.value"'
tweak:
'x-on:change="if(event.target.className=='vscomp-ele pop-comp-ele' || event.target.className=='vscomp-ele pop-comp-ele pop-comp-active'){select = event.target.value;}"'
I added console.log(event); into the attribute while testing to see all available attributes:
'x-on:change="console.log(event);select = event.target.value"'
from virtual-select.
Related Issues (20)
- Dropbox has blurry borders in Chromium browsers HOT 2
- when using server search, disableSelectAll doesn't work HOT 6
- When using popup mode and preselected values make the focus go to the dropdown when entering the screen
- The "disabled" property doesn't account for the tabindex. HOT 7
- Inline Style Css Properties is not Showing HOT 1
- Add property in the documentation HOT 1
- deselectAllOnlyVisible feature HOT 1
- Broken display of options with icons HOT 4
- Add classes to button HOT 3
- The search input is disabled when allowNewOption is set to true and the options are empty. HOT 5
- Search Feature Unresponsive After Setting an Empty List of Options HOT 3
- Scrolling is broken when a custom onServerSearch function Is defined HOT 10
- The reset() method is triggering on change event and causing an infinite loop when used on certain contexts HOT 1
- Custom values in onServerSearch are not respected HOT 1
- Scrolling gets stuck in Safari when multiple select has options selected HOT 2
- why i get the wrong in browser console: index.vue:62 Couldn't initiate Virtual Select HOT 1
- Search and Select not working with Groups HOT 1
- Dropdown gets blank after scroll to bottom and changing browser zoom
- first option always selected even when autoSelectFirstOption set to false
- When setting maxValues, first option is always selected
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from virtual-select.