this.setfocus() in IE with tabs - West Wind Technologies Support

Web Connection

this.setfocus() in IE with tabs

this.setfocus() in IE with tabs
n/a
All

Oct 1, 2015 @ 10:35am

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Re: this.setfocus() in IE with tabs
Rick Strahl
Geoff Bannoff

4GJ0S9XAK

Oct 1, 2015 @ 01:11pm

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Rick Strahl
West Wind Technologies

Making waves on the Web
from Maui

Re: this.setfocus() in IE with tabs
n/a
Rick Strahl

4GK0DB64E

Oct 2, 2015 @ 06:12am

Hi Rick

I'm trying to set the cursor into a particular field with the this.secfocus() command. I use this technique extensively throughout our system and it works in all pages, tabbed or not, if the browser isn't IE.

In IE, the this.setfocus() command works if the selected field is not inside a tabbed portion of a page. But if the field that I want to set focus to is inside a tab, even if that tab is selected, the field does not get focus.

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Re: this.setfocus() in IE with tabs
Rick Strahl
Geoff Bannoff

4GK0J7CIO

Oct 2, 2015 @ 08:57am

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Rick Strahl
West Wind Technologies

Making waves on the Web
from Maui

Re: this.setfocus() in IE with tabs
n/a
Rick Strahl

4GK0TVAWJ

Oct 2, 2015 @ 01:56pm

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Re: this.setfocus() in IE with tabs
Rick Strahl
Geoff Bannoff

4GL0HE277

Oct 3, 2015 @ 08:06am

Geoff,

I don't think jQuery in particular is the issue here. The SetFocus code should work on it's own and $().focus() does essentially the same thing, so I don't think that's the issue. You can replace the code I posted with document.getElementById() and it should work the same way if you replace the jquery code. I think you're probably right in that the page may not be fully loaded yet although the JS is loaded at the bottom of the page.

Maybe check and see where the actual script code lands. If you have nested containers then it might be that hte script is NOT at the bottom of the page in which case the timeing is going to be a bigger issue, than with the script at the bottom.

What version of IE are we talking about? Anything over 10 should be using the W3C DOM model and it should behave properly in terms of timing.

+++ Rick ---

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Rick Strahl
West Wind Technologies

Making waves on the Web
from Maui

Re: this.setfocus() in IE with tabs
n/a
Rick Strahl

4GP0A368T

Oct 7, 2015 @ 04:42am

Hi Rick

The machines where I have tested the problem are all Win7x32 machines running IE10 and IE11.

The code from wwWebPage.SetFocus() appears at the very bottom of the page.

Replacing the JQuery code with

document.getElementById("controlx");

brings back the problem--works in everything but IE.

So it must be a timing issue, which using JQuery seems to solve.

.. Geoff

Geoff,

What version of IE are we talking about? Anything over 10 should be using the W3C DOM model and it should behave properly in terms of timing.

+++ Rick ---

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Re: this.setfocus() in IE with tabs
Rick Strahl
Geoff Bannoff

4GP0NJZ6T

Oct 7, 2015 @ 10:59am

Looking at the jQUery source it doesn't look like jQuery is doing anything special with this.

But now I'm curious. What happens if you do:

setTimeout( function() { document.getElementById("controlx").focus() },50)

+++ Rick ---

Hi Rick

The machines where I have tested the problem are all Win7x32 machines running IE10 and IE11.

The code from wwWebPage.SetFocus() appears at the very bottom of the page.

Replacing the JQuery code with

document.getElementById("controlx");

brings back the problem--works in everything but IE.

So it must be a timing issue, which using JQuery seems to solve.

.. Geoff

Geoff,

What version of IE are we talking about? Anything over 10 should be using the W3C DOM model and it should behave properly in terms of timing.

+++ Rick ---

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Rick Strahl
West Wind Technologies

Making waves on the Web
from Maui

Re: this.setfocus() in IE with tabs
n/a
Rick Strahl

4GP100I8J

Oct 7, 2015 @ 04:48pm

Hi Rick

That works.

So does setting the timeout to zero

setTimeout( function() { document.getElementById("controlx").focus() }, 0)

Odd...

..Geoff

Looking at the jQUery source it doesn't look like jQuery is doing anything special with this.

But now I'm curious. What happens if you do:

setTimeout( function() { document.getElementById("controlx").focus() },50)

+++ Rick ---

Hi Rick

The machines where I have tested the problem are all Win7x32 machines running IE10 and IE11.

The code from wwWebPage.SetFocus() appears at the very bottom of the page.

Replacing the JQuery code with

document.getElementById("controlx");

brings back the problem--works in everything but IE.

So it must be a timing issue, which using JQuery seems to solve.

.. Geoff

Geoff,

What version of IE are we talking about? Anything over 10 should be using the W3C DOM model and it should behave properly in terms of timing.

+++ Rick ---

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Re: this.setfocus() in IE with tabs
Rick Strahl
Geoff Bannoff

4GP1A45CE

Oct 7, 2015 @ 09:30pm

Yeah then that is indeed a timing issue. setTimeout() gives up the execution pointer as so all other code queued up runs first, before the timer fires and then runs this code - so this is likely why it works with setTimeout.

I've added the setTimeout() to the page focus method.

+++ Rick ---

Hi Rick

That works.

So does setting the timeout to zero

setTimeout( function() { document.getElementById("controlx").focus() }, 0)

Odd...

..Geoff

Looking at the jQUery source it doesn't look like jQuery is doing anything special with this.

But now I'm curious. What happens if you do:

setTimeout( function() { document.getElementById("controlx").focus() },50)

+++ Rick ---

Hi Rick

The machines where I have tested the problem are all Win7x32 machines running IE10 and IE11.

The code from wwWebPage.SetFocus() appears at the very bottom of the page.

Replacing the JQuery code with

document.getElementById("controlx");

brings back the problem--works in everything but IE.

So it must be a timing issue, which using JQuery seems to solve.

.. Geoff

Geoff,

What version of IE are we talking about? Anything over 10 should be using the W3C DOM model and it should behave properly in terms of timing.

+++ Rick ---

Hi Rick

Yeah, your jQuery code works, even with the timeout set to zero. It's probably something to do with the document not being ready in IE, but being ready in non-IE browsers. It's a complex page.

I'll build a version of wwWebpage.Setfocus() that works with jQuery and put that in the page.

Thanks

.. Geoff

The easiest way to find out is to use some jQuery to manually focus the control and see if that works.

AFAIK IE supports focusing all the way back to 8, but certainly 9 and later do.

<script>
setTimeout(function() { $("#CtrlId").focus() },1000);    // just to be sure it's not a timing issue
</script>

Hi Rick

Here's the code for this page:

* where to place the cursor?

DO case
CASE this.ispostback = .f. OR this.tabs.selectedtab=[divParts]
	this.tabs.selectedtab = [divParts]
	this.setfocus(this.txtPartsTotal)	CASE this.tabs.selectedtab = [divEquip]
	this.setfocus(this.txtEqSerial1)
CASE this.tabs.selectedtab = [divShop]
	this.setfocus(this.txtJob)
CASE this.tabs.selectedTab = [divInvoices]
	this.setfocus(this.txtInvoice)
CASE this.tabs.selectedTab = [divBBT]
	this.setfocus(this.txtTransferAmt)
CASE this.tabs.selectedtab = [divExpenses]
	this.setfocus(this.txtAccount1)
OTHERWISE
	* don't know where to put cursor
ENDCASE

Is there any workaround apart from directing users away from IE?

.. Geoff

I'm surprised that it works in any browser. You have to activate the tab manually since the activation of the tab is driven with JavaScript.

I think there's an example in the tab example that demonstates how you can do this.

+++ Rick ---

this.setfocus(this.controlx)

works great in Firefox, Chrome, etc. in all situations.

But it doesn't work in Internet Explorer when the selected control in inside a tab. Fous does not go to that control.

Any suggestions for making this work correctly in IE?

.. Geoff

Rick Strahl
West Wind Technologies

Making waves on the Web
from Maui