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

PagerStyle slider show wired behavior in RadGrid

1 Answer 115 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Sandeep
Top achievements
Rank 1
Sandeep asked on 28 Nov 2008, 04:25 AM
Hi,
I am using RadGrid in my application. Rad grid has few columns some of them having checkboxes in them. I am using Paging on this grid. When i use default pager style it works fine, but if i use <PagerStyle Mode="Slider" />, it does not work properly. When i calls this page for first time it shows me checkboxes as per the data in the data source. Now if i click on slider to go to next page, it shows in the next page data. i am able to see all text values correct for the next page, but all check boxes are unchecked even though the datasource has true value for that column.
I am attaching sample application to reproduce this bug. In the sample application attahced you will see the correct values for checkboxes if you comment <%--<PagerStyle Mode="Slider" />--%> at line 112 in file GridSample.aspx.  Please uncomment this line to reproduce this bug. Please let me know the solution of this, i am using RadGrid in all my pages and same problem is there in all the pages. There are similar issues with grid row selection, on pages 1 it shows row 3 selected, if i go to page 2 and comes back again to page 1, it shows different row selected. i think this issue is also related to pagerstyle.

Thanks & Regards,
Sandeep Pulkundwar

Here are the three required files from my sample application
GridSample.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridSample.aspx.cs" Inherits="GridSample" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"
<head runat="server"
    <title>Untitled Page</title> 
</head> 
<body> 
    <form id="form1" runat="server"
    <asp:ScriptManager ID="ScriptManager1" runat="server"
    </asp:ScriptManager> 
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
 
        <script type="text/javascript"
                 var activeTable; 
                 var colIndex; 
                  
                 function ColumnContextMenu(sender, eventArgs) 
                 { 
                    activeTable = sender.get_masterTableView(); 
                    colIndex = GetRealCellIndex(sender.get_masterTableView(), eventArgs.get_gridColumn().get_element()); 
                 } 
                 function GetRealCellIndex(tableView, cell) 
                 { 
                     for(var i = 0; i < tableView.get_columns().length; i++) 
                     { 
                         if(tableView.get_columns()[i].get_element()== cell) 
                         { 
                             return i; 
                         } 
                     } 
                 } 
                 /// 
                 function GetCellIndex(uniqueName) 
                 { 
                     for(var i = 0; i < activeTable.get_columns().length; i++) 
                     { 
                       if(activeTable.get_columns()[i].get_uniqueName()== uniqueName) 
                       { 
                             return i; 
                       } 
                     } 
                 }                  
                 /// 
                 function ClientItemClicked(sender, eventArgs) 
                 { 
                    switch(eventArgs.get_item().get_value()) 
                    { 
                        case "Showl All Columns": 
                          RestoreColumns(); 
                          break;  
                        case "Hide Column":        
                          activeTable.hideColumn(colIndex);   
                          break;    
                        default:                         
                          activeTable.showColumn(GetCellIndex(eventArgs.get_item().get_value())); 
                          break; 
                    }   
                      
                    var col = $find("RadGrid1").get_masterTableView().get_element().tFoot.rows[0].cells[0].colSpan;                            
                    $find("RadGrid1").get_masterTableView().get_element().tFoot.rows[0].cells[0].colSpan = col + 1; 
                    //activeTable.fireCommand("Page","First"); 
                 } 
                 function RestoreColumns()  
                 { 
                    var grid = $find("<%=RadGrid1.ClientID %>"); 
                     
                    for(i = 0; i < grid.get_masterTableView().get_columns().length; i++) 
                    { 
                      grid.get_masterTableView().showColumn(i); 
                    } 
                 } 
                  
                 function ExplicitSearch() 
                 { 
//                    var grid = $find("<%=RadGrid1.ClientID %>"); 
//                    var dropdown =   document.getElementById("<%=ddlColumns.ClientID %>"); 
//                    var search = document.getElementById("<%=txtSearch.ClientID %>"); 
//                    alert(search.value); 
//                    alert(dropdown[dropdown.selectedIndex].value); 
//                    grid.get_masterTableView().fireCommand("Filter","Name" , "Name313", Telerik.Web.UI.GridFilterFunction.Contains); 
//                    //grid.get_masterTableView().fireCommand("Filter",dropdown[dropdown.selectedIndex].value , search.value, Telerik.Web.UI.GridFilterFunction.Contains); 
                 } 
        </script> 
 
    </telerik:RadCodeBlock> 
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
    </telerik:RadAjaxManager> 
    <table> 
        <tr> 
            <td> 
                Search in: 
            </td> 
            <td> 
                <asp:DropDownList ID="ddlColumns" runat="server"
                </asp:DropDownList> 
                <asp:TextBox ID="txtSearch" runat="server"></asp:TextBox> 
            </td> 
            <td> 
                <input id="Button1" type="button" value="client button" onclick="ExplicitSearch();" /> 
                <asp:Button ID="btnSearch" runat="server" Text="Server Button" OnClick="btnSearch_Click" /> 
            </td> 
        </tr> 
        <tr> 
            <td colspan="3"
                <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" GridLines="None" 
                    AllowFilteringByColumn="True" AllowPaging="True" AllowSorting="True" OnNeedDataSource="RadGrid1_NeedDataSource" 
                    OnPreRender="RadGrid1_PreRender" OnItemCreated="grdList_ItemCreated"  
                    PageSize="7" oninsertcommand="RadGrid1_InsertCommand"  
                    onitemcommand="RadGrid1_ItemCommand1"
                    <PagerStyle Mode="Slider" /> 
                    <MasterTableView AllowFilteringByColumn="true"
                        <RowIndicatorColumn> 
                            <HeaderStyle Width="20px"></HeaderStyle> 
                        </RowIndicatorColumn> 
                        <ExpandCollapseColumn> 
                            <HeaderStyle Width="20px"></HeaderStyle> 
                        </ExpandCollapseColumn> 
                        <Columns> 
                            <telerik:GridBoundColumn DataField="Name" HeaderText="Name" SortExpression="Name" 
                                UniqueName="Name" CurrentFilterFunction="Contains" AutoPostBackOnFilter="false" 
                                Display="false"
                            </telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn DataField="Subject1" HeaderText="Subject" SortExpression="Subject1" 
                                UniqueName="Subject1" CurrentFilterFunction="StartsWith" AutoPostBackOnFilter="false" 
                                Display="false"
                            </telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn DataField="RollNumber" HeaderText="Roll Number" SortExpression="RollNumber" 
                                UniqueName="RollNumber" CurrentFilterFunction="GreaterThan" AutoPostBackOnFilter="false"
                            </telerik:GridBoundColumn> 
                            <telerik:GridBoundColumn DataField="Score" HeaderText="Score" SortExpression="Score" 
                                UniqueName="Score" CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="false"
                            </telerik:GridBoundColumn> 
                            <telerik:GridTemplateColumn HeaderText="Active" UniqueName="IsActive" HeaderStyle-HorizontalAlign="Center" 
                                ItemStyle-HorizontalAlign="Center" SortExpression="IsActive" DataField="IsActive"
                                <ItemTemplate> 
                                    <asp:CheckBox ID="chkActive" runat="server" AutoPostBack="true" Checked='<%#Bind("IsActive") %>' OnCheckedChanged="chkActive_CheckedChanged"/> 
                                </ItemTemplate> 
                                <HeaderStyle HorizontalAlign="Center"></HeaderStyle> 
                                <ItemStyle HorizontalAlign="Center"></ItemStyle> 
                            </telerik:GridTemplateColumn> 
                            <telerik:GridCheckBoxColumn DataField="IsActive" HeaderText="IsActive" UniqueName="IsActive1" 
                                                        SortExpression="IsActive"  
                                CurrentFilterFunction="EqualTo" ReadOnly="True"></telerik:GridCheckBoxColumn> 
                        </Columns> 
                    </MasterTableView> 
                    <ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True" AllowColumnHide="True"
                        <Scrolling AllowScroll="True" UseStaticHeaders="True" /> 
                        <Resizing AllowColumnResize="True" EnableRealTimeResize="True" ResizeGridOnColumnResize="True" /> 
                        <ClientEvents OnColumnContextMenu="ColumnContextMenu" /> 
                    </ClientSettings> 
                    <FilterMenu EnableTheming="True"
                        <CollapseAnimation Type="OutQuint" Duration="200"></CollapseAnimation> 
                    </FilterMenu> 
                </telerik:RadGrid> 
                <telerik:RadContextMenu ID="RadMenu1" runat="server" Skin="Outlook" OnClientItemClicked="ClientItemClicked"
                    <Targets> 
                        <telerik:ContextMenuTagNameTarget TagName="thead" /> 
                    </Targets> 
                </telerik:RadContextMenu> 
            </td> 
        </tr> 
    </table> 
    <br /> 
    </form> 
</body> 
</html> 
 

GridSample.aspx.cs
using System; 
using System.Collections.Generic; 
using System.Web.UI; 
using Telerik.Web.UI; 
using System.Web.UI.WebControls; 
 
public partial class GridSample : System.Web.UI.Page 
    protected void Page_Init(object sender, EventArgs e) 
    { 
        RadMenuItem item1 = new RadMenuItem("Show Column"); 
        item1.Value = "Show Column"
        ddlColumns.Items.Add(new System.Web.UI.WebControls.ListItem("Show All", "-1")); 
        for (int i = 0; i < RadGrid1.MasterTableView.Columns.Count; i++) 
        { 
            RadMenuItem item2 = new RadMenuItem(RadGrid1.MasterTableView.Columns[i].HeaderText); 
            item2.Value = RadGrid1.MasterTableView.Columns[i].UniqueName; 
            item1.Items.Add(item2); 
 
            ddlColumns.Items.Add(new System.Web.UI.WebControls.ListItem(RadGrid1.MasterTableView.Columns[i].HeaderText, 
                                                                        RadGrid1.MasterTableView.Columns[i].UniqueName)); 
        } 
        RadMenuItem item3 = new RadMenuItem("Hide Columns"); 
        item3.Value = "Hide Column"
        RadMenuItem item4 = new RadMenuItem("Show All Columns"); 
        item4.Value = "Show All Columns"
        item1.Items.Add(item4); 
        RadMenu1.Items.Add(item1); 
        RadMenu1.Items.Add(item3); 
    } 
 
    protected void Page_Load(object sender, EventArgs e) 
    { 
 
    } 
 
    protected void RadGrid1_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e) 
    { 
        Marks m = new Marks(1, "sad", 221); 
        RadGrid1.DataSource = m.GetMarks(); 
    } 
    protected void RadGrid1_PreRender(object sender, EventArgs e) 
    { 
    } 
 
 
    protected void btnSearch_Click(object sender, EventArgs e) 
    { 
        if (!string.IsNullOrEmpty(RadGrid1.MasterTableView.FilterExpression)) 
        { 
            RadGrid1.MasterTableView.FilterExpression += " And "; 
        } 
        if (ddlColumns.SelectedValue == "-1") 
        { 
            GridColumn column = RadGrid1.MasterTableView.GetColumnSafe(ddlColumns.Items[1].Value); 
            column.CurrentFilterFunction = GridKnownFunction.NoFilter; 
            RadGrid1.MasterTableView.FilterExpression = "([" + ddlColumns.SelectedValue + "] LIKE \'%%\') "; 
            RadGrid1.MasterTableView.Rebind(); 
        } 
        else 
        { 
            RadGrid1.MasterTableView.FilterExpression = getFilterExpression(); 
            RadGrid1.MasterTableView.Rebind(); 
        } 
    } 
 
    protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e) 
    { 
        if (e.CommandName == RadGrid.FilterCommandName) 
        { 
            if (!ddlColumns.SelectedValue.Equals("-1") && !String.IsNullOrEmpty(txtSearch.Text) && !RadGrid1.MasterTableView.FilterExpression.Contains("([" + ddlColumns.SelectedValue + "] = " + txtSearch.Text + ") ")) 
            { 
                if (!string.IsNullOrEmpty(RadGrid1.MasterTableView.FilterExpression)) 
                { 
                    RadGrid1.MasterTableView.FilterExpression += " And "; 
                } 
                RadGrid1.MasterTableView.FilterExpression += getFilterExpression(); 
            } 
        } 
    } 
 
    private string getFilterExpression() 
    { 
        GridColumn column = RadGrid1.MasterTableView.GetColumnSafe(ddlColumns.SelectedValue); 
        if (column.DataType == typeof(string)) 
        { 
            return "([" + ddlColumns.SelectedValue + "] LIKE \'%" + txtSearch.Text + "%\') "; 
        } 
        else 
        { 
            return "([" + ddlColumns.SelectedValue + "] = " + txtSearch.Text + ") "; 
        } 
    } 
 
    protected virtual void grdList_ItemCreated(object sender, GridItemEventArgs e) 
    { 
        try 
        { 
            if (e.Item is GridDataItem) 
            { 
                GridDataItem item = (GridDataItem)e.Item; 
                CheckBox checkBox = (CheckBox)e.Item.FindControl("chkActive"); 
                checkBox.Attributes.Add("onclick", "if (!confirm(' nnc ')) {" + checkBox.ClientID + ".checked = !" + checkBox.ClientID + ".checked; return;}"); 
 
            } 
        } 
        catch (Exception ex) 
        {             
        } 
    } 
 
    protected void chkActive_CheckedChanged(object sender, EventArgs e) 
    { 
        CheckBox isActive = (CheckBox)sender; 
        GridDataItem dataitem = (GridDataItem)isActive.NamingContainer;        
    } 
 
    protected void RadGrid1_InsertCommand(object source, GridCommandEventArgs e) 
    { 
 
    } 
    protected void RadGrid1_ItemCommand1(object source, GridCommandEventArgs e) 
    { 
 
    } 
 
 

App_Code\Marks.cs

using System.Collections.Generic; 
 
/// <summary> 
/// Summary description for Marks 
/// </summary> 
public class Marks 
    private int rollNumber; 
 
    public int RollNumber 
    { 
        get { return rollNumber; } 
        set { rollNumber = value; } 
    } 
    private string Subject; 
 
    public string Subject1 
    { 
        get { return Subject; } 
        set { Subject = value; } 
    } 
    private int score; 
 
    public int Score 
    { 
        get { return score; } 
        set { score = value; } 
    } 
     
 
    private string name; 
    public string Name 
    { 
        get { return name; } 
        set { name = value; } 
    } 
 
 
    public Marks(int rNo, string Sub, int sc) 
    { 
        rollNumber = rNo
        SubSubject = Sub; 
        scscore = sc; 
    } 
 
    private bool isActive; 
 
    public bool IsActive 
    { 
        get { return isActive; } 
        set { isActive = value; } 
    }     
 
    public List<Marks> GetMarks() 
    { 
        List<Marks> lstMarks = new List<Marks>(); 
        for (int i = 1; i < 20; i++) 
        { 
            //for (int j = 1; j < 4; j++) 
            //{ 
                lstMarks.Add(new Marks(i, "Subject " + i.ToString(), i * i)); 
                lstMarks[i-1].Name = "Name" + (i * (i+1) / i).ToString() + i.ToString() + i.ToString(); 
                lstMarks[i-1].isActive = i%3 == 0; 
            //} 
        } 
        return lstMarks; 
    } 
 
 









1 Answer, 1 is accepted

Sort by
0
Iana Tsolova
Telerik team
answered on 01 Dec 2008, 09:24 AM
Hi Sandeep,

Indeed when the pager of the grid is Slider, after paging the grid is rebound too late for the checkboxes in the template columns to be initialized properly. Please try rebinding the grid after paging in this case:

bool _paging = false;  
protected void RadGrid1_PageIndexChanged(object sender, EventArgs e)   
{  
    _paging = true;  
}  
protected void RadGrid1_PreRender(object sender, EventArgs e)  
{  
    if (_paging)  
    {  
        RadGrid1.Rebind();  
    }  

I hope this helps.

Best wishes,
Iana
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Grid
Asked by
Sandeep
Top achievements
Rank 1
Answers by
Iana Tsolova
Telerik team
Share this question
or