Keyboard navigation and OnSelectedIndexChanged

[Charles]

I have hooked up a handler to the OnSelectedIndexChanged event (server side) on my grid. When the mouse is used to select a row, the event fires and a call is made to the server to get some detail data for the row and to display it in a separate area of the page. This postback is ajaxified via the RadAjaxManager and it all works fine.

I want to make the same code execute when KeyboardNavigation is enabled and the user is navigating through the grid using the up/down arrow keys.

I have searched the forum postings extensively and have found various suggestions, none of which work for me. I have EnablePostBackOnRowClick set to true, and that doesn't help. So, the question is, can I get the code in my server-side method to execute when the user is using the arrow keys to navigate. Is there a client-side way to do this?

I have also tried to call my ajax request method from the OnRowSelected client side. When that code executes I don't have any selected items available in the grid, even though I have set the current row to selected in the client code. I can pass the row index into the ajaxRequest, but how do I then access the appropriate row in the grid so that I can get the data key and make my call to the server with information for detail on that row?

Any suggestions would be appreciated. Thanks.

[Charles]

I have found a partial solution to my issue. It involves passing the row index from the client OnRowSelected to the ajaxRequest, converting it to an int to represent the appropriate row, and then accessing the DataSource of the grid by casting it to the list of objects originally stored there when bound and then getting the specific object in that list via the row index. That enables me to call my business method to retrieve the detail data for that row.

The part that I still haven't solved is then displaying the detail data in the section below the grid. I call into my business/data methods to get the detail information and to mark the data item from the grid as "inspected". All that is working. But, rebinding the grid to now display the fact that the row has been "inspected" (changing from bold font to regular font in the ItemDataBound event of the grid) - and binding the detail data to the detail area is not displaying any visible changes.

Here is the code in the ajax request method:

string row = !string.IsNullOrEmpty(e.Argument) ? e.Argument : "-1";
int x = Convert.ToInt32(row);

List<EVFComposite> data = rgrdEmails.DataSource as List<EVFComposite>;
Guid g = data[x].EmailId;

int userId = Session["UserId"] == null ? 0 : (int)Session["UserId"];

EVFRepository evfr = new EVFRepository();
EVFComposite evfb = evfr.GetSelectedEmail(g, userId);

ViewState["email"] = evfb;

List<EVFComposite> lst = new List<EVFComposite>();
lst.Add(evfb);
detailsViewBody.DataSource = lst;
detailsViewBody.DataBind();

evfr.SetReadUnreadStatus(g, userId, true);

rgrdEmails.Rebind();

Here is the markup for the details area:

<asp:DetailsView runat="server" ID="detailsViewBody" AutoGenerateRows="false" CssClass="message-view" GridLines="None" EnableViewState="false">
    <Fields>
        <asp:TemplateField ShowHeader="false">
            <ItemTemplate>
                <ul>
                    <li><h3 id="subject"><%# Eval("Subject") %></h3></li>
                    <li><span id="from"><%# Eval("From") %></span></li>
                    <li>Sent: <span id="sent"><%# Eval("Received") %></span></li>
                </ul>
                <div id="message-body">
                    <%# ((string)Eval("Body")).Replace("\n", "<br />") %>
                </div>
            </ItemTemplate>
        </asp:TemplateField>
    </Fields>
</asp:DetailsView>

[Iana Tsolova]

Hello Charles,

You probably need one more ajax setting to make it work. Try adding a setting where the RadAjaxManager updates the DetailsView.

In addition, if you parse the item index to the ajaxRequest() method, on the server you can get the item as below:
GridDataItem selectedItem = RadGrid1.MasterTableView.Items[index];

Or on the OnRowSelected, you can directly get the data key value. Check the article below:
http://www.telerik.com/help/aspnet-ajax/grid-extract-key-values-client-side.html

Greetings,
Iana Tsolova
the Telerik team