Setting client-side focus

10 posts, 0 answers
  1. Bill
    Bill avatar
    175 posts
    Member since:
    Apr 2010

    Posted 19 Oct 2010 Link to this post

    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?

  2. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 20 Oct 2010 Link to this post

    Would it perhaps work with some jQuery?

    if (selectedTabValue == "Patient") {
        alert("Selected tab was Patient");
        $telerik.$("#HospAcctno").focus();
    }
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Bill
    Bill avatar
    175 posts
    Member since:
    Apr 2010

    Posted 20 Oct 2010 Link to this post

    Unfortuantely, this is not an option with our development group. We need a Telerik solution.
  5. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 20 Oct 2010 Link to this post

    That is a telerik solution :)

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

  6. Bill
    Bill avatar
    175 posts
    Member since:
    Apr 2010

    Posted 20 Oct 2010 Link to this post

    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?
  7. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 20 Oct 2010 Link to this post

    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)
  8. Bill
    Bill avatar
    175 posts
    Member since:
    Apr 2010

    Posted 20 Oct 2010 Link to this post

    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?
  9. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 20 Oct 2010 Link to this post

    That was from your code, I grabbed a snippet
  10. Bill
    Bill avatar
    175 posts
    Member since:
    Apr 2010

    Posted 20 Oct 2010 Link to this post

    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?
  11. Steve
    Steve avatar
    1851 posts
    Member since:
    Dec 2008

    Posted 20 Oct 2010 Link to this post

    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"
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017