A simple jquery listener on change doesn't seem to work when use a materialize css select dropdown.
$("#somedropdown").change(function() {
alert("Element Changed");
});
1) How can I add a listener to detect when a materialize select element has changed?
2) How do I get the select value in that case?
Materializecss is no longer supported · Issue #6615 · Dogfalo/materialize · GitHub.
Unlike Bootstrap, Materialize does not require popper. js. It only requires jQuery. This is all you need to get started.
Materialize is a UI component library created with CSS, JavaScript, and HTML. Materialize UI components help in constructing attractive, consistent, and functional web pages and web apps, while adhering to modern web design principles such as browser portability, device independence, and graceful degradation.
Add an id to select
<select id="select1">
<optgroup label="team 1">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
</optgroup>
<optgroup label="team 2">
<option value="3">Option 3</option>
<option value="4">Option 4</option>
</optgroup>
</select>
Bind event listener through jquery using the id
$("#select1").on('change', function() {
console.log($(this));
});
Hope this helps :-)
JSFiddle Example Here
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With