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

Keep Grid row "selected" after postback

2 Answers 612 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Alex
Top achievements
Rank 1
Alex asked on 11 Dec 2013, 03:02 PM
Hello all,

I have been looking for a while now, and have not been able to find a solution for my problem, which could possible be very easy to fix.

I have a grid in which when the user selects a row I want it to stay highlighted. Simple enough, I can make it work, as long as there is no postback. 

I have looked at numerous posts, including Telerik's demos (http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/selecting/row-selection/defaultvb.aspx?#qsf-demo-sourcehttp://www.telerik.com/help/aspnet-ajax/grid-selecting-row-with-click-client-side.html) and yet, I cannot find a solution.

This is the style on my page:
<style type="text/css">
    .rgSelectedRow, .rgSelectedRow > td
    {
        padding:4px;
        border-right: solid 1px #CBD2DA;
        background:gray !important;
    }
</style>

This is the Grid's client settings:
<ClientSettings>
    <Selecting AllowRowSelect="True"></Selecting>
    <ClientEvents OnRowClick="namespace.rowClick" />
</ClientSettings>

Now, the rowClick JS:
rowClick: function (sender, eventArgs) {
    var masterTable = $find('<%=grdSpam.RadGrid.ClientID%>').get_masterTableView();
    var rowindex = eventArgs.get_itemIndexHierarchical();
    var dataItem = masterTable.get_dataItems()[rowindex].get_element();
    var spamFilterID = dataItem.attributes["SpamFilterID"].value;
    $find('<%=pnlSpamQuarantine.ClientID%>').ajaxRequest('ViewFile' + '|' + spamFilterID + '|' + rowindex);
}

Now, when the user clicks on a row, it stays highlighted as long as I remove the ajaxRequest. 
I have also tried to set the EnablePostBackOnRowClick and using it instead of the Javascript, but the problem remains.

In an effort to force the row to be selected coming back, I have also added code to the AjaxRequest that sets the row.Selected = True. And I verified that it is still True during the Grid PreRender event.

BTW, I am not using the GridClientSelectColumn.

Can anyone shed a light as to what I am missing here?

Thanks,
Alex



2 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 12 Dec 2013, 05:57 AM
Hi Alex,

Below is a sample code snippet that persists the selected row on postbacks:

ASPX:
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadGrid ID="RadGrid1" AllowMultiRowSelection="true" DataSourceID="SqlDataSource1" AllowPaging="true" AllowSorting="true" runat="server" AllowFilteringByColumn="true" ShowGroupPanel="true">
    <MasterTableView ClientDataKeyNames="OrderID">    
    </MasterTableView>
    <ClientSettings AllowDragToGroup="true">
        <Selecting AllowRowSelect="true" />
        <ClientEvents OnRowCreated="RadGrid1_RowCreated" OnRowSelected="RadGrid1_RowSelected"
            OnRowDeselected="RadGrid1_RowDeselected" />
    </ClientSettings>
</telerik:RadGrid>
<asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:Northwind_newConnectionString3 %>"
    ProviderName="System.Data.SqlClient" SelectCommand="SELECT OrderID,ShipCity FROM Orders"
    runat="server"></asp:SqlDataSource>

JS:
<script type="text/javascript">
    var selected = {};
    function RadGrid1_RowSelected(sender, args) {
        var orderid = args.getDataKeyValue("OrderID");
        if (!selected[orderid]) {
            selected[orderid] = true;
        }
    }
    function RadGrid1_RowDeselected(sender, args) {
        var orderid = args.getDataKeyValue("OrderID");
        if (selected[orderid]) {
            selected[orderid] = null;
        }
    }
    function RadGrid1_RowCreated(sender, args) {
        var orderid = args.getDataKeyValue("OrderID");
        if (selected[orderid]) {
            args.get_gridDataItem().set_selected(true);
        }
    }    
</script>

Thanks,
Princy
0
Alex
Top achievements
Rank 1
answered on 12 Dec 2013, 12:17 PM
Hi Princy,

Thanks for you reply. I actually fixed yesterday using the same principle (RadGrid1_RowCreated) with a few modifications.

Cheers!
Alex


Tags
Grid
Asked by
Alex
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Alex
Top achievements
Rank 1
Share this question
or