Set focus on CJuiDialog

Dear All,

I have a login dialog implemented using CjuiDialog. The dialog contains username (label+textfield), password(label+passwordfield), submit button. How could I set the focus on the username textfield when the dialog is open? Usually we can use tab to get make the first textfield active. Using dialog, I cannot use tab ;(



You can attach a handler to the dialogs open event




  'open'=>'js:function(){$("#'.$dialog_id.' input:first").focus();}',



Hi Tommy,

I did it like this and still not working ;(


// for create

    $this->beginWidget('zii.widgets.jui.CJuiDialog', array(// the dialog

        'id' => 'dialogAddAcc',




        'options' => array(

            'title' => 'Create Account',

            'show' => 'blind',

            'hide' => 'explode',

            'autoOpen' => false,

            'modal' => true,

            'width' => 750,

            'open'=>'js:function(){$("#dialogAddAcc input:first").focus();}',


    )); ?>

    <div class="divForForm"></div>

<?php $this->endWidget(); ?>

What would be the problem?



I can’t tell. My suggested solution worked well in my case (IIRC, CActiveForm IIRC).

You should try to use divForForm in the selector instead of dialogAddAcc.

Also look for error messages in Firebug Console. Examine the generated html for clues how to modify the selector to address the input field.


Have you tried to register a news script like this?


$cs = Yii::app()->getClientScript();







not working either ;(

I just had this same problem and discovered that removing the show option made the focus work properly.

With a show option (I was using ‘slide’) it seems to clear the focus when the effect finishes.