I am using bootstrap-select in a form with many entries. Now i would like to validate the form in a way that the user is guided more precisely through the missing fields. so i use:
$('html, body').animate
to scroll to the missing field / select item and then:
field.focus();
to set the cursor into an input field
Now for the select items i would like to open the dropdown in that case.
Is there a way to do that?
i was trying the following thanks to tip from muggles:
function goToFormField(field){
var offset=80;
$('html, body').animate({
scrollTop: field.parent().offset().top - offset
}, 100,"easeInOutCirc",function(){
if(field.is("input")){
field.focus();
}else if(field.is("select")){
field.selectpicker('show')
}
}
);
}
but it did not work. EDIT: the mentioned function selectpicker('show') just shows the select-item, not the dropdown contents.
Thanks.
bootstrap-select only requires an open class to be added in the same class as select element, for example:
// To Open
$('.selectpicker').addClass('open');
// To Close
$('.selectpicker').removeClass('open');
Found a simple solution here :
$('.selectpicker').selectpicker('toggle')
Basically it toggles the open/close
state. Therefore no refresh
required.
I am assuming you are talking about this plugin for Bootstrap.
If so, according to the documentation , the plugin has a .show() method which programmatically shows the bootstrap select menu.
$('.selectpicker').selectpicker('show');
You can use the following code.
setTimeout(function(){
$('#selector_id').next().click();
}, 500);
It will click the toggle dropdown button and will make the dropdown-menu open. Just replace "selector_id" with your required id.
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.