[
http://issues.apache.org/jira/browse/TAPESTRY-1102?page=comments#action_12438831
]
Greg Woolsey commented on TAPESTRY-1102:
----------------------------------------
This version of an AlertDialog works for me, trapping keystrokes properly.
Stupid typos took me a while to track down. I suggest using the body of this
example as a new version of the Tapestry widget. For that matter, the
keystroke event handlers could be moved to the base Dojo Dialog widget to fix
it's general tab navigation problem.
I had to override the whole summarizeErrors() method to implement a different
dialog widget. Would be easier if the widget name string was a field in
tapestry.form.validation instead.
dojo.provide("fireapps.widget.AlertDialog");
dojo.require("dojo.widget.*");
dojo.require("dojo.widget.Dialog");
dojo.require("dojo.widget.Button");
dojo.require("dojo.event.common");
dojo.require("dojo.html.common");
dojo.widget.defineWidget(
"fireapps.widget.AlertDialog",
dojo.widget.Dialog,
{
bgColor: "white",
bgOpacity: 0.5,
okButton:null,
messageNode:null,
message:"",
postCreate: function(args, frag, parentComp) {
dojo.widget.Dialog.prototype.postCreate.call(this,
args, frag, parentComp);
var content=document.createElement("div");
this.containerNode.appendChild(content);
dojo.html.addClass(this.containerNode, "alertDialog");
this.messageNode=document.createElement("div");
this.messageNode.innerHTML=this.message;
content.appendChild(this.messageNode);
var buttNode=document.createElement("button");
buttNode.innerHTML = "OK";
content.appendChild(buttNode);
this.okButton=buttNode;
this.tabStart=this.okButton;
this.tabEnd=this.okButton;
this.show();
dojo.event.connect(this.okButton, "onclick", this,
"hideDialog");
this.okButton.focus();
dojo.event.connect(this.wrapper, 'onkeyup', this,
'dialogKeys');
dojo.event.connect(document.body, 'onkeyup', this,
'bodyKeys');
},
dialogKeys:function(e) {
if (e.keyCode == e.KEY_ESCAPE) {
this.hideDialog(e);
}
// allow default behavior, but don't let the event keep
bubbling/propagating
if (e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true;
},
bodyKeys:function(e) {
if (e.keyCode == e.KEY_ESCAPE) {
this.hideDialog(e);
} else if ( ! dojo.dom.isDescendantOf(e.target,
this.wrapper, true) ) {
dojo.event.browser.stopEvent(e);
this.tabStart.focus();
}
},
setMessage:function(str){
this.messageNode.innerHTML=str;
},
hideDialog:function(e){
dojo.event.disconnect(this.wrapper, 'onkeyup', this,
'dialogKeys');
dojo.event.disconnect(document.body, 'onkeyup', this,
'bodyKeys');
this.hideModalDialog();
dojo.dom.removeNode(this.okButton);
tapestry.widget.AlertDialog.prototype.destroy.call(this);
dojo.dom.removeNode(this.bg);
}
},
"html"
);
> AlertDialog doesn't trap tabs or set focus to the button
> --------------------------------------------------------
>
> Key: TAPESTRY-1102
> URL: http://issues.apache.org/jira/browse/TAPESTRY-1102
> Project: Tapestry
> Issue Type: Bug
> Components: JavaScript
> Affects Versions: 4.1.1
> Reporter: Greg Woolsey
> Assigned To: Jesse Kuhnert
> Fix For: 4.1.1
>
>
> The AlertDialog widget used by the validation framework has a couple of
> navigation issues:
> 1) When it comes up, the "OK" button doesn't have the focus, but it appears
> to the user to be the only active page element.
> 2) Users can tab and shift-tab away from the dialog and enter data in form
> fields behind the bakground iframe. This is non-intuitive, and almost always
> undesired behavior.
> It appears from the parent class, DoJo's Dialog.js that giving the button a
> tabIndex, setting it as this.tabStart, and setting initial focus to it should
> fix these.
> Hard-core would be to trap all keystrokes and stop any key event that wasn't
> space or enter, but that's probably more of a hammer than is needed.
--
This message is automatically generated by JIRA.
-
If you think it was sent incorrectly contact one of the administrators:
http://issues.apache.org/jira/secure/Administrators.jspa
-
For more information on JIRA, see: http://www.atlassian.com/software/jira
---------------------------------------------------------------------
To unsubscribe, e-mail: [EMAIL PROTECTED]
For additional commands, e-mail: [EMAIL PROTECTED]
