Focus on field doesn't work in a bootbox callback

Question

I have a field and a "check" button that checks if the field is empty. The problem is that after the click on 'Ok' in the popup (I use bootbox), it doesn't focus the field.

I tried with document.getElementById("field").focus(); and $('#field').focus(); but it doesn't works

http://jsfiddle.net/b4y40q5h/

Thanks

Yes. True. It doesn't work. Your code doesn't focus even if it sent through console. First mistake, **learn HTML**. It is not `>`, but `/>`. — Praveen Kumar Purushothaman, Jun 05 '15 at 08:54
I already answered [https://stackoverflow.com/questions/21657427/bootbox-prompt-set-focus-on-text-field/54442517#54442517](https://stackoverflow.com/questions/21657427/bootbox-prompt-set-focus-on-text-field/54442517#54442517) — Wilson Rosa Gomes, Jan 30 '19 at 14:14

score 4 · Answer 1 · answered Jun 05 '15 at 08:58

4

Write this below script:

DEMO HERE

$(document).on('hidden.bs.modal','.bootbox', function () {
   $('#field').focus();
});

answered Jun 05 '15 at 08:58

Guruprasad J Rao

29,410
14
101
200

Your solution is probably the most correct, but I have more fields and I prefer the solution with the timer..thank anyway! – Pierminator Jun 05 '15 at 09:06
@Pierminator.. Not a prob!! Happy Coding.. :) – Guruprasad J Rao Jun 05 '15 at 09:08

score 3 · Accepted Answer · answered Jun 05 '15 at 08:59

The plugin, after click "ok", modifies the dom and you loose the focus, so you only need a timeout to achieve it: jsFiddle.

$("#btnCheck").click(function () {
    if ($('#field').val() == "")
    {
        bootbox.dialog({
            message: "empty field",
            title: 'my site',
            buttons: {
                danger: {
                    label: 'ok',
                    className: "btn-primary",
                     callback: function () {
                         setTimeout(function(){
                             $('#field').focus();
                         }, 10);
                     }
                }
            }
        });
    }
else
    alert('ok');
});

Even this doesn't work buddy. Check out my fiddle here: http://jsfiddle.net/praveenscience/Lcv4c5ab/ — Praveen Kumar Purushothaman, Jun 05 '15 at 09:00

score 1 · Answer 3 · answered Jun 05 '15 at 09:02

The other way is, using a setTimeout. I did it, but it didn't work for a reason, but now it works! God only knows why!

callback: function () {
    setTimeout(function () {
        console.log("F");
        $("#field").focus();
    }, 150);
}

Focus on field doesn't work in a bootbox callback

3 Answers3

Fiddle: http://jsfiddle.net/praveenscience/Lcv4c5ab/1/