Setting the focus to a field in a jQuery UI Dialog Box

I am using a jQuery-UI dialog box that has three fields on it together with an 'Update' and 'Cancel'开发者_开发知识库 buttons.

When the dialog is opened, I would like to have the focus set to the first field in that dialog, say it was calle 'ID' but from the looks of it, the focus is set to my 'Cancel' button.

How can I override this and have the focus set to 'ID' field when opened?

here the open function is called after the dialog box open happens.

$( ".selector" ).dialog({
   open: function(event, ui) {
     $('#yourText').focus();
   }
});

To set default focus on cancel button pass the index of the button. The default focus is on first button ie index 0. To set focus on second element you can use following code

$(this).parents('.ui-dialog-buttonpane button:eq(1)').focus(); 

Source code to create a dialog with two buttons and set focus on a button

     $(function() {                         
           $( "#dialog:ui-dialog" ).dialog( "destroy" );    
           $( "#dialog" ).dialog({
           modal: true,
           minHeight:200,
           minWidth:190,
           buttons: {
           Delete: function() {
            // do something                                                                     
           },
           Cancel: function() {
           $( this ).dialog("close");                               
           }
           }
     });
//to set focus on cancel button
          $(this).parents('.ui-dialog-buttonpane button:eq(1)').focus(); 
     });