I am using Materialize.css for current project, and I have dropdown with some input forms inside it.
Dropdown has option to close by:
.dropdown-content
.dropdown-content
.dropdown-button
What I need is to not close when clicking inside of it, because i need to be able to fill in input forms and other actions.
Here is simple example
Quick solution would be to stopPropagation on click on content wrapper.
$('.dropdown-button + .dropdown-content').on('click', function(event) {
event.stopPropagation();
});
I would avoid using 'dropdown' for this particular use-case. But if you want to stick to it just apply the snippet above.
You can use for example:
$('#first_name').click(function (event) {
event.stopPropagation();
//Do whatever you want
});
to avoid the event generated by the input first_name
from propagating. The dropdown will not detect it so it will not be closed.
use this "closeOnClick: false" on dropdown initializing
$(".dropdown-trigger").dropdown({
closeOnClick : false
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.