Simplemodal - how to set focus on an element in onShow function

Question

I thought it is going to be simple. Just

...
onShow:function(dialog){
   dialog.data.find("input#myInput").focus();
}
...

but it doesn't seem to work.

Is there a conflict with SimpleModal's focus() function?

I noticed that if i put an alert() inside onShow function it pops before modal is visible. Is there a way to call function (ie. focus()) after displaying modal, but without user input (without user triggering some kind of event)?

Also when i tried to use simplemodal's

focus:true

with dialog.data =

'<div class="myModal login">'+
    '<div class="modalTitle">Title</div>'+
    '<div class="modalContent">'+
       '<label for="username">Login: </label>'+
       '<input id="username" />'+
       '<br />'+
       '<label for="password">Pass: </label>'+
       '<input id="password" type="password" />'+
       '<br />'+
       '<div class="confirmButton no simplemodal-close">Cancel</div>'+
       '<div class="confirmButton yes">Login</div>'+
    '</div>'+
'</div>'

focus is on wrapper (at least i think so) and user has to press tab to get to first input element.

Any help would be great,

Greg.

Answer 1

Try this:

onShow:function(dialog){
   setTimeout(function(){
     dialog.data.find("input#myInput").focus();
   },50);
}

Hope this helps. Cheers