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

RadListView with DataGroup and Pager Not Working Properly

4 Answers 151 Views

ListView

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

Robin asked on 07 May 2015, 07:47 AM

page1.png

page2.png

page3.png

page4.png

Hello,

I am trying to implement RadListView similar to this ListView - DataGrouping Demo. But I got very strange behaviour on page changes. I've set PageSize="5" in DataPager.

Page 1: shows (5) items from 1 - 5 (Correct)
Page 2: shows (10) items from 6 - 15 (Incorrect. Extra 5 items)
Page 3: shows (15) items from 11 - 25 (Even worse. Extra 5 new items and 5 previous items. 11 to 15 was already shown on page 2)
Page 4: shows (20) items from 16 - 35 (I've no idea)
Page 5: shows (20) items from 21 - 40
Page 6: shows (15) items from 26 - 40 (Reduced 5 items. All duplicated records from previous pages)
Page 7: shows (10) items from 31 - 40 (Reduced 5 more items. All duplicated records from previous pages)
Page 8: shows (5) items from 36 - 40 (Reduced 5 more items. All duplicated records from previous pages)
Page 9: shows (5) items from next group
Same Pattern ...

I am not sure my markup have problem or my data have. You can see my sample code that will create above result below. I also attached screen shots for faster reference.

Please help and thanks in advanced.

Sample.aspx.cs

protected void RadListView1_NeedDataSource(object sender, Telerik.Web.UI.RadListViewNeedDataSourceEventArgs e)

{

RadListView1.DataSource = PrepareData();

}

private DataTable PrepareData()

{

DataTable l_Table = new DataTable();

l_Table.Columns.Add("ID");

l_Table.Columns.Add("Code");

l_Table.Columns.Add("Group");

l_Table.Columns.Add("PIN");

l_Table.Rows.Add(new object[] { 1, "A10001", "A", 8096 });

l_Table.Rows.Add(new object[] { 2, "A10002", "A", 3029 });

l_Table.Rows.Add(new object[] { 3, "A10003", "A", 9427 });

l_Table.Rows.Add(new object[] { 4, "A10004", "A", 8792 });

l_Table.Rows.Add(new object[] { 5, "A10005", "A", 7166 });

l_Table.Rows.Add(new object[] { 6, "A10006", "A", 1002 });

l_Table.Rows.Add(new object[] { 7, "A10007", "A", 4989 });

l_Table.Rows.Add(new object[] { 8, "A10008", "A", 8108 });

l_Table.Rows.Add(new object[] { 9, "A10009", "A", 8547 });

l_Table.Rows.Add(new object[] { 10, "A10010", "A", 3651 });

l_Table.Rows.Add(new object[] { 11, "A10011", "A", 2418 });

l_Table.Rows.Add(new object[] { 12, "A10012", "A", 7482 });

l_Table.Rows.Add(new object[] { 13, "A10013", "A", 2696 });

l_Table.Rows.Add(new object[] { 14, "A10014", "A", 7149 });

l_Table.Rows.Add(new object[] { 15, "A10015", "A", 8167 });

l_Table.Rows.Add(new object[] { 16, "A10016", "A", 1995 });

l_Table.Rows.Add(new object[] { 17, "A10017", "A", 4006 });

l_Table.Rows.Add(new object[] { 18, "A10018", "A", 7834 });

l_Table.Rows.Add(new object[] { 19, "A10019", "A", 6419 });

l_Table.Rows.Add(new object[] { 20, "A10020", "A", 1864 });

l_Table.Rows.Add(new object[] { 21, "A10021", "A", 2777 });

l_Table.Rows.Add(new object[] { 22, "A10022", "A", 7167 });

l_Table.Rows.Add(new object[] { 23, "A10023", "A", 6995 });

l_Table.Rows.Add(new object[] { 24, "A10024", "A", 7136 });

l_Table.Rows.Add(new object[] { 25, "A10025", "A", 2612 });

l_Table.Rows.Add(new object[] { 26, "A10026", "A", 3543 });

l_Table.Rows.Add(new object[] { 27, "A10027", "A", 3262 });

l_Table.Rows.Add(new object[] { 28, "A10028", "A", 5829 });

l_Table.Rows.Add(new object[] { 29, "A10029", "A", 3409 });

l_Table.Rows.Add(new object[] { 30, "A10030", "A", 6428 });

l_Table.Rows.Add(new object[] { 31, "A10031", "A", 2510 });

l_Table.Rows.Add(new object[] { 32, "A10032", "A", 3874 });

l_Table.Rows.Add(new object[] { 33, "A10033", "A", 6840 });

l_Table.Rows.Add(new object[] { 34, "A10034", "A", 8446 });

l_Table.Rows.Add(new object[] { 35, "A10035", "A", 6599 });

l_Table.Rows.Add(new object[] { 36, "A10036", "A", 9215 });

l_Table.Rows.Add(new object[] { 37, "A10037", "A", 8140 });

l_Table.Rows.Add(new object[] { 38, "A10038", "A", 9804 });

l_Table.Rows.Add(new object[] { 39, "A10039", "A", 9179 });

l_Table.Rows.Add(new object[] { 40, "A10040", "A", 7315 });

l_Table.Rows.Add(new object[] { 41, "B10001", "B", 9307 });

l_Table.Rows.Add(new object[] { 42, "B10002", "B", 6832 });

l_Table.Rows.Add(new object[] { 43, "B10003", "B", 2386 });

l_Table.Rows.Add(new object[] { 44, "B10004", "B", 2283 });

l_Table.Rows.Add(new object[] { 45, "B10005", "B", 3295 });

l_Table.Rows.Add(new object[] { 46, "B10006", "B", 6314 });

l_Table.Rows.Add(new object[] { 47, "B10007", "B", 1433 });

l_Table.Rows.Add(new object[] { 48, "B10008", "B", 2250 });

l_Table.Rows.Add(new object[] { 49, "B10009", "B", 1658 });

l_Table.Rows.Add(new object[] { 50, "B10010", "B", 4967 });

l_Table.Rows.Add(new object[] { 51, "B10011", "B", 6391 });

l_Table.Rows.Add(new object[] { 52, "B10012", "B", 6217 });

l_Table.Rows.Add(new object[] { 53, "B10013", "B", 5478 });

l_Table.Rows.Add(new object[] { 54, "B10014", "B", 2037 });

l_Table.Rows.Add(new object[] { 55, "B10015", "B", 3961 });

l_Table.Rows.Add(new object[] { 56, "B10016", "B", 8989 });

l_Table.Rows.Add(new object[] { 81, "C10001", "C", 5405 });

l_Table.Rows.Add(new object[] { 82, "C10002", "C", 9161 });

l_Table.Rows.Add(new object[] { 83, "C10003", "C", 7635 });

l_Table.Rows.Add(new object[] { 84, "C10004", "C", 4567 });

l_Table.Rows.Add(new object[] { 85, "C10005", "C", 1197 });

l_Table.Rows.Add(new object[] { 86, "C10006", "C", 3379 });

l_Table.Rows.Add(new object[] { 87, "C10007", "C", 4782 });

l_Table.Rows.Add(new object[] { 88, "C10008", "C", 5650 });

l_Table.Rows.Add(new object[] { 89, "C10009", "C", 7737 });

l_Table.Rows.Add(new object[] { 90, "C10010", "C", 7174 });

l_Table.Rows.Add(new object[] { 91, "C10011", "C", 8038 });

l_Table.Rows.Add(new object[] { 92, "C10012", "C", 1445 });

l_Table.Rows.Add(new object[] { 93, "C10013", "C", 9798 });

l_Table.Rows.Add(new object[] { 94, "C10014", "C", 6405 });

l_Table.Rows.Add(new object[] { 95, "C10015", "C", 2384 });

l_Table.Rows.Add(new object[] { 96, "C10016", "C", 3403 });

l_Table.Rows.Add(new object[] { 97, "C10017", "C", 6483 });

l_Table.Rows.Add(new object[] { 98, "C10018", "C", 8907 });

l_Table.Rows.Add(new object[] { 99, "C10019", "C", 5507 });

l_Table.Rows.Add(new object[] { 100, "C10020", "C", 4660 });

l_Table.Rows.Add(new object[] { 101, "C10021", "C", 9608 });

l_Table.Rows.Add(new object[] { 102, "C10022", "C", 5091 });

l_Table.Rows.Add(new object[] { 103, "C10023", "C", 7184 });

l_Table.Rows.Add(new object[] { 127, "D10001", "D", 5775 });

l_Table.Rows.Add(new object[] { 128, "D10002", "D", 6340 });

l_Table.Rows.Add(new object[] { 129, "D10003", "D", 1671 });

l_Table.Rows.Add(new object[] { 130, "D10004", "D", 2434 });

l_Table.Rows.Add(new object[] { 131, "D10005", "D", 2740 });

l_Table.Rows.Add(new object[] { 132, "D10006", "D", 5798 });

l_Table.Rows.Add(new object[] { 133, "D10007", "D", 5826 });

l_Table.Rows.Add(new object[] { 134, "D10008", "D", 6959 });

l_Table.Rows.Add(new object[] { 135, "D10009", "D", 2469 });

l_Table.Rows.Add(new object[] { 136, "D10010", "D", 6864 });

l_Table.Rows.Add(new object[] { 137, "D10011", "D", 8379 });

l_Table.Rows.Add(new object[] { 138, "D10012", "D", 8301 });

l_Table.Rows.Add(new object[] { 139, "D10013", "D", 7469 });

l_Table.Rows.Add(new object[] { 140, "D10014", "D", 2079 });

l_Table.Rows.Add(new object[] { 141, "D10015", "D", 5101 });

l_Table.Rows.Add(new object[] { 142, "D10016", "D", 9003 });

l_Table.Rows.Add(new object[] { 143, "D10017", "D", 7630 });

l_Table.Rows.Add(new object[] { 144, "D10018", "D", 4189 });

return l_Table;

}

Sample.aspx

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">

<telerik:RadListView ID="RadListView1" runat="server" ItemPlaceholderID="DataGroupPlaceHolder3"

OnNeedDataSource="RadListView1_NeedDataSource"

AllowPaging="True" GroupAggregatesScope="AllItems" DataKeyNames="ID">

<ItemTemplate>

<div style="display: inline-block; background-color: white; padding: 10px; margin: 10px;">

<div>

<b>ID: </b>

<%#Eval("ID")%>

</div>

<div class="category model">

<b>Code: </b>

<%#Eval("Code")%>

</div>

<div class="category">

<b>PIN: </b>

<%#Eval("PIN")%>

</div>

</ItemTemplate>

<LayoutTemplate>

<asp:Panel ID="DataGroupPlaceHolder2" runat="server">

</asp:Panel>

<telerik:RadDataPager ID="RadDataPager1" runat="server" PagedControlID="RadListView1"

Skin="Silk" PageSize="5" class="clearfix">

<Fields>

<telerik:RadDataPagerButtonField FieldType="FirstPrev" FirstButtonText="First" PrevButtonText="Prev"></telerik:RadDataPagerButtonField>

<telerik:RadDataPagerButtonField FieldType="Numeric" PageButtonCount="10"></telerik:RadDataPagerButtonField>

<telerik:RadDataPagerButtonField FieldType="NextLast" NextButtonText="Next" LastButtonText="Last"></telerik:RadDataPagerButtonField>

</Fields>

</telerik:RadDataPager>

</LayoutTemplate>

<GroupSeparatorTemplate>

</GroupSeparatorTemplate>

<DataGroups>

<telerik:ListViewDataGroup GroupField="Group" DataGroupPlaceholderID="DataGroupPlaceHolder2"

SortOrder="Ascending">

<DataGroupTemplate>

<asp:Panel runat="server" ID="Panel3" GroupingText='<%# "Group:<b>" + (Container as RadListViewDataGroupItem).DataGroupKey + "</b>"%> '>

<asp:PlaceHolder runat="server" ID="DataGroupPlaceHolder3"></asp:PlaceHolder>

</asp:Panel>

</DataGroupTemplate>

<GroupAggregates>

<telerik:ListViewDataGroupAggregate Aggregate="First" DataField="Group" />

</GroupAggregates>

</telerik:ListViewDataGroup>

</DataGroups>

</telerik:RadListView>

</telerik:RadAjaxPanel>

4 Answers, 1 is accepted

Accepted

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

RadListView with DataGroup and Pager Not Working Properly

4 Answers, 1 is accepted