CustomPaging and DetailTables

[Rob]

I'm evaluating RadGrid as a possible replacement for custom grid work that we have been doing. We essentially want to use a few features at the same time but it seems that CustomPaging and DetailTables are not compatible. I keep getting "This method is supported only for pager mode NumericPages Source" errors. Is it possible to have CustomPaging and DetailTables at the same time? If I use NumericPages, detail works. When I hook in our custom paging dropdown, detail no longer works but custom paging works. I hope I'm just missing something!

Thanks!

/Rob

ASPX:

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPlaceholder.master" AutoEventWireup="true" CodeFile="AccountsTest.aspx.cs" Inherits="Accounts_AccountsTest" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

    <!-- custom head section -->
    <style type="text/css">
            .GridPager_Default INPUT
            {
                border: 1px solid gray;
                height: 14px;
                font-size: 11px;
            }
            .CustomPagerHolder
            {
                float:left;
            }
            .NumericPagerHolder
            {
                float:right;
            }
            </style>
    <!-- end of custom head section -->

     <telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

        <!-- content start -->
        <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
            <AjaxSettings>
                <telerik:AjaxSetting AjaxControlID="RadGrid1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
                <telerik:AjaxSetting AjaxControlID="DropDownList1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>

            </AjaxSettings>
        </telerik:RadAjaxManager>
        <telerik:RadGrid ID="RadGrid1" OnPreRender="RadGrid1_PreRender" ShowStatusBar="true"
            runat="server" AutoGenerateColumns="False" PageSize="10" AllowSorting="True" AllowMultiRowSelection="False"
            AllowPaging="True" GridLines="None"
            OnNeedDataSource="RadGrid1_NeedDataSource" OnItemCreated="RadGrid1_ItemCreated">

            <MasterTableView DataKeyNames="Account_ID" AllowMultiColumnSorting="True" DataMember="Accounts">
                <DetailTables>
                    <telerik:GridTableView DataKeyNames="Account_ID" Width="100%" DataMember="Detail"
                        runat="server">
                        <ParentTableRelation>
                            <telerik:GridRelationFields DetailKeyField="Account_ID" MasterKeyField="Account_ID" />
                        </ParentTableRelation>
                        <Columns>
                            <telerik:GridBoundColumn SortExpression="Legal_Name" HeaderText="Legal Name" HeaderButtonType="TextButton"
                                DataField="Legal_Name" UniqueName="LegalName">
                            </telerik:GridBoundColumn>
                            <telerik:GridBoundColumn SortExpression="Current_Effective_Date" HeaderText="Current Effective Date" HeaderButtonType="TextButton"
                                DataField="Current_Effective_Date" UniqueName="CurrentEffectiveDate" DataFormatString="{0:D}">
                            </telerik:GridBoundColumn>
                        </Columns>
                    </telerik:GridTableView>
                </DetailTables>
                <Columns>
                    <telerik:GridBoundColumn SortExpression="Account_ID" HeaderText="AccountID" HeaderButtonType="TextButton"
                        DataField="Account_ID" UniqueName="AccountID">
                    </telerik:GridBoundColumn>
                    <telerik:GridBoundColumn SortExpression="Account_Name" HeaderText="Account Name" HeaderButtonType="TextButton"
                        DataField="Account_Name" UniqueName="AccountName">
                    </telerik:GridBoundColumn>
                </Columns>

                <PagerStyle Mode="NumericPages" PageButtonCount="5" AlwaysVisible="true"></PagerStyle>

            </MasterTableView>
        </telerik:RadGrid>

</asp:Content>

ASPX.CS:

using System;
using System.Collections.Generic;
using System.Data;
using System.Data.Common;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;


using HealthConnect.DAL;

using Telerik.Web.UI;


public partial class Accounts_AccountsTest : HealthConnect.Web.AMS.AMSPage
{

    private DataSet getData()
    {

        {snip query setup}

        DataSet dataSet = db.ExecuteDataSet(dbCommand);

        dataSet.Tables[0].TableName = "Accounts";
        dataSet.Tables[1].TableName = "Paging";
        dataSet.Tables[2].TableName = "Detail";

        DataColumn[] quotedGridParentColumns = {
                dataSet.Tables["Accounts"].Columns["Account_ID"] };

        DataColumn[] planChildColumns = {
                dataSet.Tables["Detail"].Columns["Account_ID"] };

        DataRelation dr = new DataRelation("pkPlanDetail",
            quotedGridParentColumns, planChildColumns, false);

        dataSet.Relations.Add(dr);

        return dataSet;

    }

    protected void RadGrid1_NeedDataSource(object source, Telerik.Web.UI.GridNeedDataSourceEventArgs e)
    {
        DataSet dataSet = getData();
        RadGrid1.DataSource = dataSet;
        ViewState["PagingInfo"] = dataSet.Tables[1];
        ViewState["CurrentPage"] = RadGrid1.CurrentPageIndex;
    }



    protected void RadGrid1_ItemCreated(object sender, GridItemEventArgs e)
    {
        if (e.Item is GridPagerItem)
        {
        //
        // If this is uncommented detail doesn't work, if this is commented detail works.
        //
            //GridPagerItem item = (GridPagerItem)e.Item;
            //Control numericPager = item.GetNumericPager();
            //item.PagerContentCell.Controls.Clear();

            //Panel myPagerPanel = new Panel();
            //myPagerPanel.CssClass = "CustomPagerHolder";

            //myPagerPanel.Controls.Add(new MyPager(e.Item.OwnerTableView.PagingManager, e.Item.OwnerTableView, (DataTable)ViewState["PagingInfo"], (int)ViewState["CurrentPage"]));
            //item.PagerContentCell.Controls.Add(myPagerPanel);

        }
    }

    private class MyPager : Control
    {
        private GridPagingManager paging;
        private GridTableView tableView;
        private DataTable dataTable;
        private int currentPage = 0;

        DropDownList dropDownList;

        public MyPager(GridPagingManager paging, GridTableView tableView, DataTable dataTable, int currentPage)
        {
            this.paging = paging;
            this.tableView = tableView;
            this.dataTable = dataTable;
            this.currentPage = currentPage;

            this.EnsureChildControls();
        }

        protected override void CreateChildControls()
        {
            this.Controls.Add(new LiteralControl("Page: "));

            dropDownList = new DropDownList();
            dropDownList.ID = "DropDownList1";

            dropDownList.DataTextField = "Text";
            dropDownList.DataValueField = "Value";

            dropDownList.SelectedIndexChanged += new EventHandler(this.SelectedIndexChanged);
            dropDownList.AutoPostBack = true;

            this.Controls.Add(dropDownList);
        }

        protected override void OnPreRender(EventArgs e)
        {

            dropDownList.DataSource = this.dataTable;
            dropDownList.DataBind();

            // This doesn't work, CurrentPageIndex is always 0
            //dropDownList.SelectedIndex = this.paging.CurrentPageIndex;
            dropDownList.SelectedIndex = currentPage;

            base.OnPreRender(e);
        }

        private void SelectedIndexChanged(object sender, EventArgs e)
        {
            this.tableView.CurrentPageIndex = dropDownList.SelectedIndex;
            this.tableView.Rebind();
        }

    }


}

[Veli]

Hi Robert,

Custom paging is supported with detail tables. The problem you are getting originates from the fact that you have enabled NumericPages mode for the master table only. The detail table defaults to another pager mode. In the ItemCreated event, you are calling GetNumericPager() method of the pager item. This method is supported with NumericPages mode. Thus, the code works for the master table but fails for the detail table. To fix the issue, simply enable NumericPages for the detail table too:

...
<DetailTables>

    <telerik:GridTableView DataKeyNames="Account_ID" Width="100%" DataMember="Detail"

        runat="server">

        <ParentTableRelation>

            <telerik:GridRelationFields DetailKeyField="Account_ID" MasterKeyField="Account_ID" />

        </ParentTableRelation>

        <Columns>

            <telerik:GridBoundColumn SortExpression="Legal_Name" HeaderText="Legal Name" HeaderButtonType="TextButton"

                DataField="Legal_Name" UniqueName="LegalName">

            </telerik:GridBoundColumn>

            <telerik:GridBoundColumn SortExpression="Current_Effective_Date" HeaderText="Current Effective Date" HeaderButtonType="TextButton"

                DataField="Current_Effective_Date" UniqueName="CurrentEffectiveDate" DataFormatString="{0:D}">

            </telerik:GridBoundColumn>

        </Columns>

        <PagerStyle Mode="NumericPages" PageButtonCount="5" AlwaysVisible="true"></PagerStyle>

    </telerik:GridTableView>

</DetailTables>
...

Veli
the Telerik team

[Robert]

Thanks Veli! That's got it working!