AccessKey and Firefox 3.5.2 Problem

[ThomasH]

the enclosed dynamic form has buttons with access keys defined. They work well in Internet Explorer. Pressing alt and a,d,s and after that Enter leads to the alert.

But this does not work in Firefox. Pressing alt+shift and a,d,s and after that Enter has no reaction.

Any idea what I have done wrong?

Regards Thomas

isc.DynamicForm.create(
    {
     ID:"receiptForm_1",
     height:400,
     width:500,
     fields:
     [
      {
       type:"toolbar",
       buttons:
       [
        {
         type:"button",
         click:function (parameter1, parameter2) {alert("add") },
         accessKey:"a",
         title:"Add"
        },
        {
         accessKey:"d",
         type:"button",
         click:function (parameter1, parameter2) {alert("delete") },
         ID:"deleteButton_1",
         title:"Delete"
        },
        {
         accessKey:"s",
         type:"button",
         click:function (parameter1, parameter2) {alert("delete") },
         ID:"saveButton_1",
         title:"Save"
        }
       ]
      }
     ]
    }
);

[Isomorphic]

1. What's your exact SmartClient version?

2. Does this happen for you in a clean install of Firefox with absolutely no browser plugins installed (including common ones like Skype)

[ThomasH]

Hello,

Thank you for your quick response.

Sorry, forgot to mention, I´m using SmartClient 7.0rc2.

Tested with plain Firefox leads to same result.

Regards Thomas

[ThomasH]

Any idea why shortcuts are not working in Firefox?

[Isomorphic]

Looks like either a recent Firefox or SmartClient regression. It'll be looked at shortly.

[ThomasH]

Anything new, how we could get accessKeys working with Firefox?

[Isomorphic]

Hi
Sorry for the delay - We've got this fixed in our internal code base but haven't put together a new, public build recently.
I've added patch code to resolve this issue for 7.0rc2 to our addendums forum here.

Let us know if it doesn't fix it for you
Thanks
Isomorphic Software

[ThomasH]

Hello,

thank you for the fix. It is now a little bit better. There are still issues with the shortcuts.

1. Buttons in tabs, that have the same shortcut in an other tab, are not responding in Firefox. This works well in Internet Explorer. Below I have created a testcase for you

2. The shortcuts are not working in Chrome

Regards Thomas

isc.TabSet.create({
    ID: "topTabSet",
    tabBarPosition: "top",
    width: 500,
    height: 300,
    tabs: [
        {title: "First Tab",  
		 pane: 
		 isc.DynamicForm.create(
			{
			 height:100,
			 width:200,
			 fields:
			 [
			  {
			   type:"toolbar",
			   buttons:
			   [
				{
				 type:"button",
				 click:function (parameter1, parameter2) {alert("First tab add") },
				 accessKey:"a",
				 title:"Add"
				},
				{
				 accessKey:"d",
				 type:"button",
				 click:function (parameter1, parameter2) {alert("First tab delete") },
				 title:"Delete"
				},
				{
				 accessKey:"s",
				 type:"button",
				 click:function (parameter1, parameter2) {alert("First tab save") },
				 title:"Save"
				}
			   ]
			  }
			 ]
			}
		)
		 },
        {title: "Second Tab", 
         pane: 
		 isc.DynamicForm.create(
			{
			 height:100,
			 width:200,
			 fields:
			 [
			  {
			   type:"toolbar",
			   buttons:
			   [
				{
				 type:"button",
				 click:function (parameter1, parameter2) {alert("Second tab add") },
				 accessKey:"a",
				 title:"Add"
				},
				{
				 accessKey:"d",
				 type:"button",
				 click:function (parameter1, parameter2) {alert("Second tab delete") },
				 title:"Delete"
				},
				{
				 accessKey:"s",
				 type:"button",
				 click:function (parameter1, parameter2) {alert("Second tab save") },
				 title:"Save"
				}
			   ]
			  }
			 ]
			}
		)		 
		 
		 }
    ]
});

[Isomorphic]

Hi Thomas,
1. This is actually an issue with colliding accessKeys. You can't have 2 widgets drawn on the same page with the same access key (even if one of them is hidden).
In TabSets, when a tab is deselected, its pane is hidden but not clear()'d from the DOM. You should be able to resolve this by adding a tabDeselected() handler to your tab which calls 'clear()' on the pane (and you may need a tabSelected() handler which calls something like if (!this.pane.isDrawn()) this.pane.draw();
We'll look into making the default behavior for focusable elements with accesskeys in tabset panes better for future releases.

2. There's an issue in Safari and Chrome whereby you can't have a widget have tabIndex -1 (IE be excluded from the page's tab order) but still have a working accessKey. This is caused by a native browser limitation.
In your example the Toolbar buttons are ending up with a tab-index of -1 (so they are not in the tab order and they're tripping this Chrome / Safari behavior).
Actually they shouldn't be defaulting to this tab index in your example - it's hitting a somewhat obscure and now resolved SmartClient logic bug.
The best workaround for this for now is for you to explicitly specify a tabIndex on your buttons. Try setting them all to zero and you should be able to tab through them in the order in which they are drawn.

[ThomasH]

Hello,

thank you very much for this valuable hints. I was able resolve the issues with your suggestions. It is like you wrote: For Firefox just add to each TabSet

tabSelected: function (tabNumber, pane) {if (pane.isDrawn()) pane.draw();},
tabDeselected: function (tabNumber, pane) {pane.clear();},

And for Chrome, set tabIndex to 0 in each button. With the above fix, the shortcuts are working now well with all browsers.

Would be nice, if this could be handled by SmartClient in the background.

And for Christmas, I´m wishing shortcuts for tabs :-)

Regards Thomas