On Thu, Sep 24, 2009 at 6:10 PM, Tim <[email protected]> wrote:
>
> I have a jquery UI dialog with two buttons: OK and Cancel. When the
> dialog opens, I want the OK button to be in focus. Here is my code:
>
> $('#confirmationDialog').dialog({
> autoOpen: false,
> width: 400,
> height: 200,
> draggable: false,
> resizable: false,
> modal: true,
> closeOnEscape: false,
> bgiframe: true,
> buttons: {
> "Cancel": function() {
> $(this).dialog("close");
> },
> "OK": function() {
> window.location = 'somepage.html';
> }
> }
> });
>
> It seems that the jquery UI dialog puts the first defined button (in
> my case, the "Cancel" button) in focus by default. But I want the
> second button (the "OK" button) to be in focus.
>
> I do not want to change the order of the definition of the buttons,
> because I want the OK button to be on the left, and the buttons
> floated right (as they are by default).
>
> I have read elsewhere on the internet that a fix is to add the
> following to my dialog definition:
>
> open: function() {
> $(this).parents('.ui-dialog-buttonpane button:eq(0)').focus();
> },
>
That's pretty close. Try this:
open: function() {
$(this).closest('.ui-dialog').find('.ui-dialog-buttonpane
button:has(OK)').focus();
}
$(this) is the ui-dialog-content element, on which you called .dialog. So
you go up to the ui-dialog with either parents() or closest(). Then back
down with .find() to the button inside the ui-dialog-buttonpane. You can use
:eq(0) or :eq(1), but :has(OK) is nice and semantic.
- Richard
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
