Hello,
I created my own PagerTemplate as described here.
Because the Grid only groups the shown rows on the page I decided to disable the Paging so the user can see all grouped rows.
Before I created my own PagerTemplate the disable function of the behaviour worked.
Here is the asp code:
<script type="text/javascript"><!-- function Grid_Paging_PageIndexChanged(sender) { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); var dropdownlist = document.getElementById("ctl00_cphMain_DataControl1_Grid_ctl00_ctl00_DropDownList1"); //var dropdownlist = document.getElementById("<%=Grid.ClientID%>".concat("_ctl00_ctl00_DropDownList1")); dropdownlist.options[parentGrid.get_behaviors().get_paging().get_pageIndex()].selected = true; } function PrevButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); if (parentGrid.get_behaviors().get_paging().get_pageIndex() > 0) { parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageIndex() - 1); }} function NextButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); if (parentGrid.get_behaviors().get_paging().get_pageIndex() < parentGrid.get_behaviors().get_paging().get_pageCount() - 1) { parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageIndex() + 1); }} function FirstButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); parentGrid.get_behaviors().get_paging().set_pageIndex(0);} function LastButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageCount() - 1);} function IndexChanged() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); var dropdownlist = document.getElementById("ctl00_cphMain_DataControl1_Grid_ctl00_ctl00_DropDownList1"); parentGrid.get_behaviors().get_paging().set_pageIndex(dropdownlist.selectedIndex);}</script> <iggrd:WebHierarchicalDataGrid ID="Grid" runat="server" Width="576px" Height="250px" OnLoad="Grid_Load" OnRowSelectionChanged="Grid_RowSelectionChanged" OnDataFiltered="Grid_DataFiltered" OnColumnSorted="Grid_ColumnSorted" ImageDirectory="" OnInit="Grid_Init" OnGroupedColumnsChanged="Grid_GroupedColumnsChanged" OnRowIslandDataBinding="Grid_RowIslandDataBinding" ShowFooter="True" AutoGenerateBands="False" > <GroupingSettings EnableColumnGrouping="True" GroupAreaVisibility="Visible" InitialRowExpandState="Collapsed" ShowBandInGroupByArea="False" > </GroupingSettings> <Behaviors> <iggrd:Activation> </iggrd:Activation> <iggrd:Selection CellClickAction="Row" RowSelectType="Single" CellSelectType="None"> <AutoPostBackFlags RowSelectionChanged="True" /> </iggrd:Selection> <iggrd:Filtering> </iggrd:Filtering> <iggrd:Paging PageSize="30" QuickPages="5" PagerMode="NumericFirstLast"> <PagingClientEvents PageIndexChanged="Grid_Paging_PageIndexChanged" /> <PagerTemplate> <asp:Button runat="server" ID="FirstButton" Text="<<" OnClientClick="FirstButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="PrevButton" Text="<" OnClientClick="PrevButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="NextButton" Text=">" OnClientClick="NextButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="LastButton" Text=">>" OnClientClick="LastButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:DropDownList ID="DropDownList1" runat="server" Height="26px" OnChange="IndexChanged()" ></asp:DropDownList> <asp:Label ID="PageCount" runat="server" Text="von 1" Height="22px"></asp:Label> </PagerTemplate> </iggrd:Paging> <iggrd:ColumnMoving> </iggrd:ColumnMoving> <iggrd:ColumnResizing> </iggrd:ColumnResizing> <iggrd:Sorting> </iggrd:Sorting> <iggrd:SummaryRow> </iggrd:SummaryRow> </Behaviors> </iggrd:WebHierarchicalDataGrid>
<script type="text/javascript"><!--
function Grid_Paging_PageIndexChanged(sender) { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); var dropdownlist = document.getElementById("ctl00_cphMain_DataControl1_Grid_ctl00_ctl00_DropDownList1"); //var dropdownlist = document.getElementById("<%=Grid.ClientID%>".concat("_ctl00_ctl00_DropDownList1"));
dropdownlist.options[parentGrid.get_behaviors().get_paging().get_pageIndex()].selected = true; }
function PrevButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); if (parentGrid.get_behaviors().get_paging().get_pageIndex() > 0) { parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageIndex() - 1); }}
function NextButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); if (parentGrid.get_behaviors().get_paging().get_pageIndex() < parentGrid.get_behaviors().get_paging().get_pageCount() - 1) { parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageIndex() + 1); }}
function FirstButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); parentGrid.get_behaviors().get_paging().set_pageIndex(0);}
function LastButton_Click() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView(); parentGrid.get_behaviors().get_paging().set_pageIndex(parentGrid.get_behaviors().get_paging().get_pageCount() - 1);}
function IndexChanged() { var grid = $find('<%=Grid.ClientID%>'); var parentGrid = grid.get_gridView();
var dropdownlist = document.getElementById("ctl00_cphMain_DataControl1_Grid_ctl00_ctl00_DropDownList1"); parentGrid.get_behaviors().get_paging().set_pageIndex(dropdownlist.selectedIndex);}</script>
<iggrd:WebHierarchicalDataGrid ID="Grid" runat="server" Width="576px" Height="250px" OnLoad="Grid_Load" OnRowSelectionChanged="Grid_RowSelectionChanged" OnDataFiltered="Grid_DataFiltered" OnColumnSorted="Grid_ColumnSorted" ImageDirectory="" OnInit="Grid_Init" OnGroupedColumnsChanged="Grid_GroupedColumnsChanged" OnRowIslandDataBinding="Grid_RowIslandDataBinding" ShowFooter="True" AutoGenerateBands="False" > <GroupingSettings EnableColumnGrouping="True" GroupAreaVisibility="Visible" InitialRowExpandState="Collapsed" ShowBandInGroupByArea="False" > </GroupingSettings>
<Behaviors> <iggrd:Activation> </iggrd:Activation> <iggrd:Selection CellClickAction="Row" RowSelectType="Single" CellSelectType="None"> <AutoPostBackFlags RowSelectionChanged="True" /> </iggrd:Selection> <iggrd:Filtering> </iggrd:Filtering> <iggrd:Paging PageSize="30" QuickPages="5" PagerMode="NumericFirstLast"> <PagingClientEvents PageIndexChanged="Grid_Paging_PageIndexChanged" /> <PagerTemplate> <asp:Button runat="server" ID="FirstButton" Text="<<" OnClientClick="FirstButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="PrevButton" Text="<" OnClientClick="PrevButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="NextButton" Text=">" OnClientClick="NextButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:Button runat="server" ID="LastButton" Text=">>" OnClientClick="LastButton_Click(); return false" Height="22px" CssClass=".igg_PageLink" /> <asp:DropDownList ID="DropDownList1" runat="server" Height="26px" OnChange="IndexChanged()" ></asp:DropDownList> <asp:Label ID="PageCount" runat="server" Text="von 1" Height="22px"></asp:Label> </PagerTemplate> </iggrd:Paging> <iggrd:ColumnMoving> </iggrd:ColumnMoving> <iggrd:ColumnResizing> </iggrd:ColumnResizing> <iggrd:Sorting> </iggrd:Sorting> <iggrd:SummaryRow> </iggrd:SummaryRow> </Behaviors> </iggrd:WebHierarchicalDataGrid>
In the code-behind I have disabled the Paging behaviour in the GroupedColumsChanged event.
protected void Grid_GroupedColumnsChanged(object sender, GroupedColumnsChangedEventArgs e) { if (e.GroupedColumns.Count > 0) { Grid.Behaviors.Paging.Enabled = false; } else { Grid.Behaviors.Paging.Enabled = true; //Grid.Rows[0].Items.FindItemByKey(e.GroupedColumns[0].ColumnKey).Column.Hidden = false; } }
Can I disable the paging on the client?
Infragistics Version: 2014 Volume 2.
I guess this is the issue if you have missed to set ClientIDMode="Static".
Anyway, thank you for sharing the other solution you have found, so that other community member can benefit from it also. Please let me know if you have any further questions on the matter.
Thanks but that only worked on the page initialization. If I change the page my JavaScript can't find the PageCount label.
So I tried another solution and this works for me. On every execution of the populateList method I create the label dynamically if the getElementByID() function can not find it.
I attached the sample.
Hello Mathias,
This is strange. However you can easily move the element after the dropdown using BLOCKED SCRIPT
document.getElementsByClassName("igg_Pager")[0].appendChild(document.getElementById("PageCount"));
You need to execute this line both in the end of Grid_Init() and Grid_Paging_PageIndexChanged() functions.
I have one more thing.
In the custom pager I defined a label after the dropdownlist which represents the page count of the grid.
Unfortunatelly the label pageCount is rendered as a text node inside the DropDownlist.
If I set the label before the list it will be rendered as a separate label element.
You can see the issue in your sample too.
I am glad this helped. Please let me know if you have further questions in the matter.