This is a migrated thread and some comments may be shown as answers.

Setting client-side focus

9 Answers 135 Views
TabStrip
This is a migrated thread and some comments may be shown as answers.
Bill
Top achievements
Rank 2
Bill asked on 20 Oct 2010, 12:58 AM
I've tried to set client side focus to the first field in a tab using the OnClientTabSelected function of the tabstrip. It doesn't set focus...

Below is  my html:

<

 

telerik:RadTabStrip ID="tsPatientDemographics" runat="server" AutoPostBack="false" OnClientTabSelected="HighlightInitialTabField"

 

 

ScrollButtonsPosition="Right" MultiPageID="RadMultiPage1" BackColor="Gray" CausesValidation="False"

 

 

Align="Left">

 


Below is my js:

 

function HighlightInitialTabField(sender, eventArgs) {

                var selectedTab = eventArgs.get_tab();
               
                if (selectedTab != null) {
                    var selectedTabValue = selectedTab.get_text();

                    if (selectedTabValue == "Patient") {
                        var HospAcctno = document.getElementById("HospAcctno");
                        HospAcctno.focus();
                    }
                    else if (selectedTabValue == "Guarantor") {
                        var GuarRelToPat = document.getElementById("GuarRelToPat");
                        GuarRelToPat.focus();
                    }
                    else if (selectedTabValue == "Pri Ins") {
                        var priInsCode = document.getElementById("priInsCode");
                        priInsCode.focus();
                    }
                    else if (selectedTabValue == "Sec Ins") {
                        var secInsCode = document.getElementById("secInsCode");
                        secInsCode.focus();
                    }
                    else if (selectedTabValue == "Ter Ins") {
                        var terInsCode = document.getElementById("terInsCode");
                        terInsCode.focus();
                    }
                }
            }

When I use the onblur client side event to set focus on a field with another function, it works fine using the same type of syntax above.

During debugging, I am positive that one of the "elses" are hit and it goes into trying to set focus.

Any reason why it doesn't work with the OnClientTabSelected event?

9 Answers, 1 is accepted

Sort by
0
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 20 Oct 2010, 05:34 AM
Would it perhaps work with some jQuery?

if (selectedTabValue == "Patient") {
    alert("Selected tab was Patient");
    $telerik.$("#HospAcctno").focus();
}
0
Bill
Top achievements
Rank 2
answered on 20 Oct 2010, 03:19 PM
Unfortuantely, this is not an option with our development group. We need a Telerik solution.
0
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 20 Oct 2010, 03:21 PM
That is a telerik solution :)

The telerik components use jQuery quite extensively...thats what the $telerik.$ prefix is on the jQuery selector

0
Bill
Top achievements
Rank 2
answered on 20 Oct 2010, 03:48 PM
Do I need to download the jquery software?

If so, what do I need to do to reference the jquery functions from the web page?
0
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 20 Oct 2010, 03:50 PM
Just try the line I put there...if there's a telerik component on the page jQuery should be loading automatically

(once you go jQuery, you never go back)
0
Bill
Top achievements
Rank 2
answered on 20 Oct 2010, 03:59 PM
The field selectedTabValue in your code has to be retrieved from somewhere...

Do I need to put your code inside a js function, etc? If so, how do I call it?
0
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 20 Oct 2010, 04:00 PM
That was from your code, I grabbed a snippet
0
Bill
Top achievements
Rank 2
answered on 20 Oct 2010, 04:03 PM
Right...

I'm calling the function HighlightInitialTabField that I have below in my code from the OnClientTabSelected event of the RadTabStrip.

Should I be calling that same function and instead of the code I have, place your jquery code?
0
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
answered on 20 Oct 2010, 04:06 PM
Yeah try it, just replace
var HospAcctno = document.getElementById("HospAcctno");
                        HospAcctno.focus();

with this

$telerik.$("#HospAcctno").focus();

I mean the other thing to also doublecheck is that the ID is actually "HospAcctno", and not an asp.net mangled name like "ctl00_ctl01_HospAcctno"
Tags
TabStrip
Asked by
Bill
Top achievements
Rank 2
Answers by
sitefinitysteve
Top achievements
Rank 2
Iron
Veteran
Bill
Top achievements
Rank 2
Share this question
or