I can't seem to set the focus on Bootbox's textfield automatically.
here's my code:
function setCode(myCode){
bootbox.confirm("Enter your PIN: <input id='pin_code' type='password' name='pin_code'></input>",
function(result) {
if(result)
console.log($("#pin_code").val());
});
$("#pin_code").focus();
};
Perhaps something about bootbox's code is getting in the way?
You can register a shown
event handler that sets the focus (as suggested by @Shiny). However, as of Bootstrap 3 and Bootbox v4.x.x, the shown event is namespaced and it is necessary to use the fully qualified name shown.bs.modal
to register the event handler. So the code would be:
var box = bootbox.confirm("Enter your PIN: <input id='pin_code' type='password' name='pin_code'></input>",
function(result) {
if(result)
console.log($("#pin_code").val());
});
box.on('shown.bs.modal',function(){
$("#pin_code").focus();
});
Trying to set the focus as you were doesn't work because the dialog isn't visible immediately after the call to bootbox.confirm
. Elements that aren't visible can't have focus.
You can try this code
var box = bootbox.confirm("Enter your PIN: <input id='pin_code' type='password' name='pin_code'></input>",
function(result) {
if(result)
console.log($("#pin_code").val());
});
box.on('shown',function(){
$("#pin_code").focus();
});