PDA

View Full Version : [CLOSED] Simple example of server-side paging with DataVIew control



drizzie
Nov 10, 2014, 3:39 PM
Can you show me a simple example of how to implement server-side paging using the dataview control and paging toolbar? I could not find one in the examples.

Daniil
Nov 10, 2014, 4:35 PM
Hi @drizzie,

Here is an example.

Example

<%@ Page Language="C#" %>

<script runat="server">
public static List<object> TestData = new List<object>
{
new { test = "test1" },
new { test = "test2" },
new { test = "test3" },
new { test = "test4" },
new { test = "test5" }
};

protected void Store_ReadData(object sender, StoreReadDataEventArgs e)
{
List<object> data = TestData;
var limit = e.Limit;

if ((e.Start + e.Limit) > data.Count)
{
limit = data.Count - e.Start;
}

List<object> rangeData = (e.Start < 0 || limit < 0) ? data : data.GetRange(e.Start, limit);
e.Total = data.Count;
(sender as Store).DataSource = rangeData;
}
</script>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET Example</title>

<style>
.my-dataview .my-item {
color: green;
}

.my-dataview .x-item-selected {
background-color: gray;
}
</style>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:Panel
runat="server"
Width="535"
Title="DataView">
<Items>
<ext:DataView
ID="DataView1"
runat="server"
Cls="my-dataview"
MultiSelect="true"
ItemSelector="div.my-item">
<Store>
<ext:Store ID="Store1" runat="server" OnReadData="Store_ReadData" PageSize="3">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="test" />
</Fields>
</ext:Model>
</Model>
<Proxy>
<ext:PageProxy />
</Proxy>
</ext:Store>
</Store>
<Tpl runat="server">
<Html>
<tpl for=".">
<div class="my-item">{test}</div>
</tpl>
</Html>
</Tpl>
</ext:DataView>
</Items>
<BottomBar>
<ext:PagingToolbar runat="server" StoreID="Store1" />
</BottomBar>
</ext:Panel>
</form>
</body>
</html>

drizzie
Nov 10, 2014, 7:39 PM
Thanks! That works great!