Telerik RadGrid Add/Edit Row Performance Issue

RSolberg picture RSolberg · Dec 17, 2009 · Viewed 8.5k times · Source

In a Telerik RadGrid, the user has the ability to add a row and edit an existing one. It appears that the grids actually force a postback to occur before the UI controls are rendered on the screen. I'm noticing a second to two seconds delay from the time the button is clicked to the time the controls appear. This seems about a second to two seconds too long. Here is my code, I'm not exactly sure what the bug is.

I apologize in advance for the "whatz wrongz with me codez post", but this seems like the easiest way to go about this one. Again, I have a performance issue and would like to figure out how to solve it in terms of what code needs to be tweaked.....

<asp:UpdatePanel ID="upPhone" runat="server">
    <contenttemplate>
            <telerik:RadGrid runat="server" ID="gridPhone" DataSourceID="dsPhone" AutoGenerateColumns="False"
                Width="100%" AllowAutomaticDeletes="True" AllowAutomaticInserts="True"
                GridLines="None" Skin="Vista" AllowAutomaticUpdates="True" 
                ondatabound="gridPhone_DataBound" onitemdeleted="gridPhone_ItemDeleted" 
                oniteminserted="gridPhone_ItemInserted" 
                onitemupdated="gridPhone_ItemUpdated" 
                onneeddatasource="gridPhone_NeedDataSource">
                <MasterTableView DataKeyNames="phone_id" CommandItemDisplay="Top" 
                    EditMode="InPlace" AllowFilteringByColumn="False">
                    <Columns>
                        <telerik:GridEditCommandColumn ButtonType="ImageButton" UniqueName="EditCommandColumn">
                            <ItemStyle CssClass="MyImageButton" />
                        </telerik:GridEditCommandColumn>
                        <telerik:GridBoundColumn DataField="phone_id" ReadOnly="true" UniqueName="phone_id"
                            Visible="false">
                        </telerik:GridBoundColumn>
                        <telerik:GridDropDownColumn DataField="d_phone_type_id" DataSourceID="dsPhoneType"
                            UniqueName="d_phone_type_id" DataType="System.Int32" ListValueField="d_phone_type_id"
                            ListTextField="name" HeaderText="Type">
                        </telerik:GridDropDownColumn>
                        <telerik:GridTemplateColumn HeaderText="Number" SortExpression="number" UniqueName="number">
                            <ItemTemplate>
                                <asp:Label runat="server" ID="lblPhoneNumber" Text='<%# Eval("number", "{0:(###) ###-####}") %>'></asp:Label>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:TextBox ID="txtNumber" MaxLength="10" runat="server" Text='<%# Bind("number") %>'></asp:TextBox>

                            </EditItemTemplate>
                        </telerik:GridTemplateColumn>
                        <telerik:GridBoundColumn DataField="description" UniqueName="description" HeaderText="Description">
                        </telerik:GridBoundColumn>
                        <telerik:GridCheckBoxColumn DataField="isprimary" UniqueName="isprimary" HeaderText="Primary"
                            DataType="System.Int16">
                        </telerik:GridCheckBoxColumn>
                        <telerik:GridButtonColumn ConfirmText="Delete this number?" ConfirmDialogType="RadWindow"
                            ConfirmTitle="Delete" ButtonType="ImageButton" CommandName="Delete" Text="Delete"
                            UniqueName="DeleteColumn">
                            <ItemStyle HorizontalAlign="Center" CssClass="MyImageButton" />
                        </telerik:GridButtonColumn>
                    </Columns>
                    <EditFormSettings>
                        <EditColumn UniqueName="EditCommandColumn1">
                        </EditColumn>
                    </EditFormSettings>
                </MasterTableView>
                <ClientSettings>
                    <Selecting AllowRowSelect="True" />
                </ClientSettings>
            </telerik:RadGrid>
            <asp:ObjectDataSource ID="dsPhoneType" runat="server" 
                OldValuesParameterFormatString="original_{0}" SelectMethod="GetPhoneTypes" 
                TypeName="DataAccess"></asp:ObjectDataSource>
            <asp:SqlDataSource ID="dsPhone" runat="server" ConnectionString="<%$ ConnectionStrings:TBD %>"
                DeleteCommand="DELETE FROM [phone] WHERE [phone_id] = @phone_id" InsertCommand="INSERT INTO [phone] ([person_id],[d_phone_type_id], [number], [description], [isprimary]) VALUES (@person_id,@d_phone_type_id, @number, @description, @isprimary)"
                SelectCommand="get_PhoneById" UpdateCommand="UPDATE [phone] SET [d_phone_type_id] = @d_phone_type_id, [number] = @number, [description] = @description, [isprimary] = @isprimary WHERE [phone_id] = @phone_id"
                SelectCommandType="StoredProcedure">
                <SelectParameters>
                    <asp:ControlParameter ControlID="lblID" Name="person_id" PropertyName="Text" Type="Int32" />
                </SelectParameters>
                <DeleteParameters>
                    <asp:Parameter Name="phone_id" Type="Int32" />
                </DeleteParameters>
                <UpdateParameters>
                    <asp:Parameter Name="d_phone_type_id" Type="Int32" />
                    <asp:Parameter Name="number" Type="Int64" />
                    <asp:Parameter Name="description" Type="String" />
                    <asp:Parameter Name="isprimary" Type="Boolean" />
                    <asp:Parameter Name="phone_id" Type="Int32" />
                </UpdateParameters>
                <InsertParameters>
                    <asp:ControlParameter ControlID="lblID" Name="person_id" PropertyName="Text" />
                    <asp:Parameter Name="d_phone_type_id" Type="Int32" />
                    <asp:Parameter Name="number" Type="Int64" />
                    <asp:Parameter Name="description" Type="String" />
                    <asp:Parameter Name="isprimary" Type="Boolean" />
                </InsertParameters>
            </asp:SqlDataSource>
        </contenttemplate>
</asp:UpdatePanel>

Answer

Robert W picture Robert W · Dec 17, 2009

Just a couple of things to check:

Are you duplicating the bind behaviour in the gridPhone_NeedDataSource event, your ItemUpdated, Deleted and Inserted events, and the native Rad Grid binding behviour (by using a asp:SqlDataSource control)? It would be useful to see your code-behind to see if you are or not.

How many records do you have in the grid? I find if I have a large number of items in the Grid and have some of the advanced features turned on (I've noticed you've got row selecting enabled) the grid grinds to a halt.

If none of these work/apply to your situation then it maybe worth checking the performance section of their site.