I am using Bootstrap, from Twitter for genereting modal-dialog in a Marionette Application.
I would like to know what is the best way to focus the first field in modal forms without using fancy javascript.
Here my code:
var app = new Marionette.Application();
app.addRegions({
modal: '#modal'
});
app.vent.on('showModal', function (view) {
var modal = app.modal;
modal.show(view);
modal.$el.modal({
show: true,
keyboard: true,
backdrop: 'static'
});
});
Answer: Use the jQuery . focus() method focus() method to set the focus on the first input box or textarea inside the Bootstrap modal when it is loaded upon activation.
To set focus to an HTML form element, the focus() method of JavaScript can be used. To do so, call this method on an object of the element that is to be focused, as shown in the example. Example 1: The focus() method is set to the input tag when user clicks on Focus button.
After the modal verb, use the word be followed by the –ing form of the main verb. I should be going. You can add a modal verb before a verb in the present perfect continuous tense without changing much. However, when using a modal verb, you must always use “have,” never “had,” even if the subject is third-person.
You can use the shown event as seen in the doc
modal.$el.on('shown', function () {
$('input:text:visible:first', this).focus();
});
If odupont
's answer didn't help you,(like me,) try this:
$('.modal').on('shown.bs.modal', function () {
$('#firstField').focus();
})
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