[Solved] RadGrid focus and arrow keys

[Paul]

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.

 

 

 

[Attila Antal]

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

[Paul]

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

[Attila Antal]

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