Opened 5 years ago

Closed 5 years ago

#10593 closed feature (duplicate)

Dialog: Allow the focused element (on close) to be configured

Reported by: PeterB Owned by: PeterB
Priority: minor Milestone: none
Component: ui.dialog Version: 1.10.0
Keywords: Cc:
Blocked by: Blocking:

Description

The "bug" which was fixed in 1.10 (I believe) which restores focus on close means you can no longer make a dialog open on focus.

If you do you can never close the dialog (because when the close resets focus the focus trigger event reloads the dialog).

Please add an option to let it work as it used to before this (painful for us) "fix".

Change History (5)

comment:1 Changed 5 years ago by tj.vantoll

Owner: set to PeterB
Status: newpending

Hey PeterB,

Could you give an example of what exactly you're trying to build here? I'm not seeing any problems opening a dialog on focus: http://jsfiddle.net/tj_vantoll/4exLqcge/.

Thanks.

comment:2 Changed 5 years ago by PeterB

Status: pendingnew

Hi - maybe I was not clear. The problem is that you can't close a dialog that is opened on focus.

The following demonstrates (when you set the HEAD references to a 1.10 or later version of jQuery UI). In IE, the dialog re-opens when you click Cancel. In Firefox and Chrome it closes by then all underlying fields are disabled.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" href="../TAS-edit-jQueryUI-10591/TAS_files/jquery-ui.css" />
<script type="text/javascript" src="../TAS-edit-jQueryUI-10591/TAS_files/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="../TAS-edit-jQueryUI-10591/TAS_files/jquery-ui-1.11.0.js"></script>
<script type="text/javascript">
$(document).ready(function () {

	var personSearchDIV = $("div.personSearch");

	personSearchDIV.dialog({
                autoOpen: false,
                modal: true,
                buttons: {
                    Ok: function () { alert("OK processing removed!"); },
                    Close: function () {
                        personSearchDIV.dialog("close");
                    }
                }
	});

    $("input.personSelect").focus(function () {
		$("div.personSearch").dialog("open");
    });
	

});
</script>
</head>

<body>
<form>

<input type="text" value="tab into next field" width="20em" />
<br />
<input type="text" name="xxx" class="personSelect" />

<div id="divPersonSearch" class="personSearch">
<input id="hdGuidList" style="display: none" />
<input id="txtPersonSearch" type="text" /><!-- The input field --> 
<ul id="lstUsers" class="selectedUsers"></ul><!-- the list of any current selections -->
</div>
</form>
</body>
</html>

comment:3 Changed 5 years ago by tj.vantoll

Status: newopen
Summary: Need option to prevent "Restore focus on close"Dialog: Allow the focused element (on close) to be configured

Ah I see. You can't give focus back to the opening element because it just reopens the dialog. I reduced this: http://jsfiddle.net/tj_vantoll/dLj83838/1.

You can configure the focusable element in an extension (for example http://jsfiddle.net/tj_vantoll/dLj83838/), but it's not documented or intuitive. I think this is something we should consider making an official extension point.

comment:4 Changed 5 years ago by PeterB

Better still - just a .dialog option to say "work as it used to do before 1.10" ;-)

"focusOnClose", say with options:

  • true - default, do as now
  • false - don't apply focus anywhere
  • jQuery-selector - go there
Last edited 5 years ago by PeterB (previous) (diff)

comment:5 Changed 5 years ago by Scott González

Resolution: duplicate
Status: openclosed

Duplicate of #9977.
Opening a dialog on focus is strange UX. See the discussion in #9977.

Note: See TracTickets for help on using tickets.