RadGrid focus and arrow keys

4 posts, 2 answers
  1. Paul
    Paul avatar
    13 posts
    Member since:
    Oct 2011

    Posted 16 Jan Link to this post

    In my radgrid when I click a row it fires the server side event OnSelectedIndexChanged.  However, I am losing focus after postback and the arrow keys stop working to navigate up/down in the grid.  As a work around I am setting the focus to a LinkButton control in the last selected row which gives me arrow key control back, but it does highlight the LinkButton which looks odd.

    protected void Page_PreRender(object sender, EventArgs e)
    {
      rgOrderItem.SelectedItems[0].FindControl("lbtnPartNumber").Focus();
    }

     

    How can I get focus on the RadGrid where the arrow keys will work but not focus on a control in the current row?  I have tried focusing on labels, but arrow keys don't work I assume because labels don't except keyboard input.  I have also tried the following:

    // 1.
    rgOrderItem.Focus();
     
    // 2.
    rgOrderItem.MasterTableView.Focus();
     
    // 3.
    rgOrderItem.Parent.Focus();
     
    //4.
    rgOrderItem.MasterTableView.Parent.Focus();
     
    //5.
    rgOrderItem.SelectedItems[0].Focus();
     
    //6.
    rgOrderItem.SelectedItems[0].Parent.Focus();
     
    //7.
    rgOrderItem.SelectedItems[0].Parent.Parent.Focus();

     

    I notice if I click on whitespace inside the grid and below the last row, my focus seems to be where it needs to be and my arrow keys work without anything selected in a grid row, but I can't figure out how to programmatical target this area.  Please help.  Thanks.

     

     

     

  2. Answer
    Attila Antal
    Admin
    Attila Antal avatar
    303 posts

    Posted 21 Jan Link to this post

    Hi Paul,

    By default controls that are no configured explicitly, will loose focus after a Post back. If you wish to set the focus on RadGrid once the post back is finished, you can set focus using JavaScript. You can do that either on pageLoad or OnGridCreated event.

    For example uses the OnGridCreated client-side event to apply focus for the grid once:

    function OnGridCreated(sender, args) {
        $(sender.get_element()).focus();
    }


    Kind regards,
    Attila Antal
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Paul
    Paul avatar
    13 posts
    Member since:
    Oct 2011

    Posted 21 Jan in reply to Attila Antal Link to this post

    I was trying to set the focus from the server side.  I ended up setting the focus on the client side GridData elelment

    document.getElementById("ctl00_mainContent_rgOrderItem_GridData").focus();

    Thanks

  4. Answer
    Attila Antal
    Admin
    Attila Antal avatar
    303 posts

    Posted 21 Jan Link to this post

    Hi Paul,

    The Focus() method works mainly on interactive controls such as Buttons, Select elements, Inputs, CheckBoxes and those that have a Tab Index defined. See Which HTML elements can receive focus?. Although the method is available in the code-behind as it is inherited from the Controls object, it will not have an effect on all controls.

    RadGrid, in the other hand, is designed to interpret/consume client-events, and hence the focus can be applied on client-side. One of the most optimum event is the GridCreated event. This will only fire when the HTML element and its components are created and ready.

    I hope this will be helpful.

    Kind regards,
    Attila Antal
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top