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

checkbox selection is very slow...

1 Answer 166 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Babu Puchakayala
Top achievements
Rank 1
Babu Puchakayala asked on 30 Jun 2010, 03:19 PM
Hi,

I am using telerik radgrid. The radgrid performance is worst in following  scenarios. Please let me know if there is any other way to improve the performance.

1. I have radgrid with PagerStyle Mode="NextPrevAndNumeric" option, In dropdown i implemented "viewall" option to show all rows in a grid. When i selected view all option the radgrid performance is very slow in both  IE6, IE7 and Firefox. Even its getting stuck (See the attached image) in both browsers. I am showing around 6000 records in radgrid. Its taking around 30sec - 40sec to show the all rows in a grid and the grid is very slow for swapping, filtering, sorting and even for scrolling down.

2. I have GridClientSelectColumn in my radgrid. When I am showing all rows in a grid and when I am trying to select all rows in a grid using check box column its getting very slow in IE7(around 6 - 7 sec to select all rows) But in Firefox it is better( 2 sec).

Is there any better way to improve performance of a radgrid. Is there other way to bind the data to the grid when user select "viewall" option?

Please find my attached code.

.ASPX

<asp:Content ID="Content1" ContentPlaceHolderID="CSS_ScriptPlaceHolder" runat="Server"
    <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"
        <link href="CSS/Css.css" rel="stylesheet" type="text/css" /> 
        <script type="text/javascript"
 
            function onAgrtypeOther() { 
                if (document.getElementById('tabTskDet_tabAgreInfo_ddlAgreementType').selectedIndex == 4) 
                    document.getElementById('trAgrTypeOther').style.visibility = 'visible'
                else 
                    document.getElementById('trAgrTypeOther').style.visibility = 'hidden'
                return false; 
            } 
            function onPertypeOther() { 
                if (document.getElementById('tabTskDet_tabPermit_ddlPermitType').selectedIndex == 3) 
                    document.getElementById('tdPerTypeOther').style.visibility = 'visible'
                else 
                    document.getElementById('tdPerTypeOther').style.visibility = 'hidden'
                return false; 
            } 
            function onSitetypeOther() { 
                if (document.getElementById('tabTskDet_tabGenTskDet_ddlSiteType').selectedIndex == 4) 
                    document.getElementById('tabTskDet_tabGenTskDet_tdSiteTypeOth').style.visibility = 'visible'
                else 
                    document.getElementById('tabTskDet_tabGenTskDet_tdSiteTypeOth').style.visibility = 'hidden'
                return false; 
 
            } 
            function onPwrtypeOther() { 
                if (document.getElementById('tabTskDet_tabGenTskDet_ddlPwrStatus').selectedIndex == 4) 
                    document.getElementById('tabTskDet_tabGenTskDet_tdPwrStatusOth').style.visibility = 'visible'
                else 
                    document.getElementById('tabTskDet_tabGenTskDet_tdPwrStatusOth').style.visibility = 'hidden'
                return false; 
            } 
            function onEqiLoctypeOther() { 
                if (document.getElementById('tabTskDet_tabGenTskDet_ddlEquiLocDesc').selectedIndex == 3) 
                    document.getElementById('tabTskDet_tabGenTskDet_tdEquiLocDescOth').style.visibility = 'visible'
                else 
                    document.getElementById('tabTskDet_tabGenTskDet_tdEquiLocDescOth').style.visibility = 'hidden'
                return false; 
            } 
            function showOthRea() { 
                var dt1 = new Date(document.getElementById("tabTskDet_tabGenTskDet_txtConstSchCompDate").value); 
                var dt2 = new Date(document.getElementById("tabTskDet_tabGenTskDet_txtConstActCompDate").value); 
                if (dt1 < dt2) { 
                    document.getElementById("tabTskDet_tabGenTskDet_tdDtLateRea306").style.display = "block" 
                } 
                else { 
                    document.getElementById("tabTskDet_tabGenTskDet_tdDtLateRea306").style.display = "none" 
                    document.getElementById("tabTskDet_tabGenTskDet_lblDueDtLateRea").value = '' 
                } 
            } 
            function showOthRea303() { 
                var dt1 = new Date(document.getElementById("tabTskDet_tabGenTskDet_txtContSchComDt").value); 
                var dt2 = new Date(document.getElementById("tabTskDet_tabGenTskDet_txtConstActComDt").value); 
                if (dt1 < dt2) { 
                    document.getElementById("tabTskDet_tabGenTskDet_tdDtLateRea303").style.display = "block" 
                } 
                else { 
                    document.getElementById("tabTskDet_tabGenTskDet_tdDtLateRea303").style.display = "none" 
                    document.getElementById("tabTskDet_tabGenTskDet_lbl303DueDtLateRea").value = '' 
                } 
            } 
            function DisplayDateToday(sender, args) { 
                if (sender._selectedDate == null) { 
                    sender._selectedDate = new Date(); 
                } 
            } 
            function onRequestStart(sender, args) { 
                if (args.get_eventTarget().indexOf("ExportToExcelButton") >= 0 || 
                    args.get_eventTarget().indexOf("ExportToWordButton") >= 0 || 
                    args.get_eventTarget().indexOf("ExportToPdfButton") >= 0 || 
                    args.get_eventTarget().indexOf("ExportToCsvButton") >= 0) { 
 
                    args.set_enableAjax(false); 
                } 
            } 
        </script> 
 
        <style> 
            .modalBackground 
            { 
                background-color: Gray; 
                filter: alpha(opacity=70); 
                opacity: 0.7; 
            } 
            .AjaxCalendar .ajax__calendar_container 
            { 
                border: 1px solid #646464; 
                background-color: White; 
                color: Black; 
            } 
            .AjaxCalendar .ajax__calendar_other .ajax__calendar_day, .AjaxCalendar .ajax__calendar_other .ajax__calendar_year 
            { 
                color: #999999; 
            } 
            .AjaxCalendar .ajax__calendar_hover .ajax__calendar_day, .AjaxCalendar .ajax__calendar_hover .ajax__calendar_month, .AjaxCalendar .ajax__calendar_hover .ajax__calendar_year 
            { 
                color: Red; 
            } 
            .AjaxCalendar .ajax__calendar_active .ajax__calendar_day, .AjaxCalendar .ajax__calendar_active .ajax__calendar_month, .AjaxCalendar .ajax__calendar_active .ajax__calendar_year 
            { 
                background-color: #78C43C; 
                color: Black; 
                text-align: center; 
                font-weight: bold; 
            } 
            .rgPageFirst, .rgPagePrev, .rgPageNext, .rgPageLast 
            { 
                display: none !important; 
            } 
            div.RadGrid_Default .rgHeader, div.RadGrid_Default th.rgResizeCol 
            { 
                background-image: none; 
            } 
        </style> 
    </telerik:RadCodeBlock> 
</asp:Content> 
<asp:Content ID="Content2" ContentPlaceHolderID="PagePlaceholder" runat="Server"
    <div style="width: 100%; padding-top: 20px"
        <table style="width: 98%"
            <tr> 
                <td colspan="2"
                    <asp:Label runat="server" Font-Bold="true" Font-Size="14pt" ID="lblTskName"></asp:Label> 
                </td> 
            </tr> 
            <tr> 
                <td colspan="2"
                    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"
                    </telerik:RadScriptManager> 
                    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
                        <ClientEvents OnRequestStart="onRequestStart" /> 
                        <AjaxSettings> 
                            <telerik:AjaxSetting AjaxControlID="rg209"
                                <UpdatedControls> 
                                    <telerik:AjaxUpdatedControl ControlID="rg209" LoadingPanelID="RadAjaxLoadingPanel1" /> 
                                </UpdatedControls> 
                            </telerik:AjaxSetting> 
                        </AjaxSettings> 
                    </telerik:RadAjaxManager> 
                    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default"
                    </telerik:RadAjaxLoadingPanel> 
                    <telerik:RadGrid ID="rg209" runat="server" AutoGenerateColumns="false" Height="550px" 
                        OnNeedDataSource="rg209_NeedDataSource" Width="100%" AllowPaging="True" AllowSorting="True" 
                        AllowMultiRowSelection="True" EnableHeaderContextMenu="true" GridLines="None" 
                        EnableHeaderContextFilterMenu="true" AllowMultiRowEdit="true" AllowFilteringByColumn="True" 
                        OnPreRender="rg209_PreRender" OnItemCreated="rg209_ItemCreated" EnableViewState="false"
                        <HeaderStyle Height="20px" BackColor="#004000" Font-Size="8pt" Font-Bold="True" ForeColor="White" 
                            HorizontalAlign="Center" BorderColor="White" BorderWidth="1px" /> 
                        <ExportSettings IgnorePaging="true" ExportOnlyData="true"
                            <Pdf AllowModify="false" AllowPrinting="true" PageBottomMargin="" PageFooterMargin="" 
                                PageHeaderMargin="" PageHeight="11in" PageLeftMargin="" PageRightMargin="" PageTopMargin="" 
                                PageWidth="14in" /> 
                        </ExportSettings> 
                        <MasterTableView DataKeyNames="orderId" CommandItemDisplay="Top" EditMode="InPlace" 
                            PageSize="10"
                            <CommandItemSettings ShowExportToWordButton="true" ShowExportToExcelButton="true" 
                                ShowExportToCsvButton="true" ShowExportToPdfButton="true" ShowAddNewRecordButton="false" /> 
                            <Columns> 
                                <telerik:GridClientSelectColumn UniqueName="ClientSelectColumn" HeaderStyle-Width="3%" 
                                    ItemStyle-Width="3%"
                                </telerik:GridClientSelectColumn> 
                                <telerik:GridBoundColumn UniqueName="sId" HeaderText="sId" DataField="sId" Visible="false"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="orderId" HeaderText="orderId" DataField="orderId" 
                                    Visible="false"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Customer Name" HeaderText="Customer Name" DataField="Customer Name" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Market Name" HeaderText="Market Name" DataField="Market Name" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="LOB" HeaderText="LOB" DataField="LOB" ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Headend Name" HeaderText="Headend Name" DataField="Headend Name" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Project Name" HeaderText="Project Name" DataField="Project Name" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Site Name" HeaderText="Site Name" DataField="Site Name" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Task Status" HeaderText="Task Status" DataField="Task Status" 
                                    ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Sch SM Imp Date" HeaderText="Sch SM Imp Date" 
                                    DataField="Sch SM Imp Date" ReadOnly="true"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Target PTD" HeaderText="Target PTD" DataField="Target PTD"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Actual PTD" HeaderText="Actual PTD" DataField="Actual PTD"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Foc Date" HeaderText="Foc Date" DataField="Foc Date"
                                </telerik:GridBoundColumn> 
                                <telerik:GridBoundColumn UniqueName="Notification Date" HeaderText="Notification Date" 
                                    DataField="Notification Date"
                                </telerik:GridBoundColumn> 
                                <telerik:GridCheckBoxColumn UniqueName="Include FOC?" HeaderText="Include FOC?" DataField="Include FOC?"
                                </telerik:GridCheckBoxColumn> 
                                <telerik:GridCheckBoxColumn UniqueName="Include DLR?" HeaderText="Include DLR?" DataField="Include DLR?"
                                </telerik:GridCheckBoxColumn> 
                                <telerik:GridEditCommandColumn UniqueName="ECC209"
                                </telerik:GridEditCommandColumn> 
                            </Columns> 
                        </MasterTableView> 
                        <ClientSettings EnableRowHoverStyle="true" ReorderColumnsOnClient="false" AllowDragToGroup="false" 
                            AllowColumnsReorder="True"
                            <Scrolling AllowScroll="true" EnableVirtualScrollPaging="false" UseStaticHeaders="true" /> 
                            <Selecting AllowRowSelect="True"></Selecting> 
                            <Resizing AllowRowResize="true" AllowColumnResize="True" EnableRealTimeResize="True" 
                                ResizeGridOnColumnResize="False"></Resizing> 
                        </ClientSettings> 
                        <PagerStyle Mode="NextPrevAndNumeric" AlwaysVisible="true"></PagerStyle> 
                    </telerik:RadGrid> 
                </td> 
            </tr> 
            <tr> 
                <td colspan="2"
                    &nbsp; 
                </td> 
            </tr> 
        </table> 
    </div> 
</asp:Content> 
 


.CS

public partial class Tak209 : System.Web.UI.Page 
    protected void Page_Load(object sender, EventArgs e) 
    { 
        try 
        { 
            if (!IsPostBack) 
            { 
                Session["SearchRes"] = null; 
                if (Session["TaskName"] != null) 
                    lblTskName.Text = Session["TaskName"].ToString(); 
                Session["FilColms"] = null; 
                Session["SortExp"] = null; 
                Session["FilExp"] = null; 
                Session["ViewAll"] = null; 
                BindGrid(); 
            } 
        } 
        catch (Exception ex) 
        { 
            throw ex; 
        } 
    } 
 
    private void BindGrid() 
    { 
        try 
        { 
            DataSet dsResult = new DataSet(); 
 
            clsSearch_BL clsObj = new clsSearch_BL(); 
            clsObj.TaskID = (string)Session["TaskID"]; 
            clsObj.CustName = (string)Session["CustName"]; 
            clsObj.MarketName = (string)Session["MarketName"]; 
            clsObj.HeadendName = (string)Session["HeadendName"]; 
            clsObj.SiteName = (string)Session["SiteName"]; 
            clsObj.TaskStatus = (string)Session["TaskStatus"]; 
            clsObj.OrdType = (string)Session["OrdType"]; 
            clsObj.OrdStatus = (string)Session["OrdStatus"]; 
            clsObj.ProName = (string)Session["ProName"]; 
            clsObj.LOC = (string)Session["LOC"]; 
            clsObj.QuoteID = (string)Session["QuoteID"]; 
            clsObj.CMNumber = (string)Session["CMNumber"]; 
 
            if (Session["SearchRes"] == null) 
            { 
                dsResult = clsObj.getSearchResults_BL(clsObj); 
                Session["SearchRes"] = dsResult; 
            } 
            else 
                dsResult = (DataSet)Session["SearchRes"]; 
 
            DataView dataView = dsResult.Tables[0].DefaultView; 
            rg209.DataSource = dsResult
            //rg209.DataBind(); 
        } 
        catch (Exception ex) 
        { 
            throw ex; 
        } 
    } 
 
    protected void rg209_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e) 
    { 
        BindGrid(); 
    } 
 
    protected void rg209_PreRender(object sender, EventArgs e) 
    { 
        rg209.MasterTableView.GetColumnSafe("RowIndicator").Display = false
 
    } 
 
    protected void rg209_ItemCreated(object sender, GridItemEventArgs e) 
    { 
        if (e.Item is GridPagerItem) 
        { 
            RadComboBox combo = (e.Item as GridPagerItem).FindControl("PageSizeComboBox") as RadComboBox; 
 
            // The number of items shown when all is selected  
            int allRowsCount = int.MaxValue; 
 
            // Remove duplicates  
            RadComboBoxItem duplicate = combo.Items.FindItemByValue(allRowsCount.ToString()); 
            if (duplicate != null) 
            { 
                duplicate.Remove(); 
            } 
 
            // Create a new item for showing all  
            RadComboBoxItem item = new RadComboBoxItem("All", allRowsCount.ToString()); 
            item.Attributes.Add("ownerTableViewId", e.Item.OwnerTableView.ClientID); 
            combo.Items.Add(item); 
 
            // Set the current pagesize as the selected value  
            combo.Items.FindItemByValue(rg209.PageSize.ToString()).Selected = true
        } 
    } 
 

1 Answer, 1 is accepted

Sort by
0
Pavlina
Telerik team
answered on 05 Jul 2010, 11:00 AM
Hi Babu,

I already answered your other ticket with the same question. However, you can see the answer here.

Kind regards,
Pavlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Tags
Grid
Asked by
Babu Puchakayala
Top achievements
Rank 1
Answers by
Pavlina
Telerik team
Share this question
or