Aug 03, 2012, 10:48 AM
[CLOSED] Shared store with buffered grid
I am trying to use an infinite scroll grid but need to share the store client side for various reasons and want to be able to hide (as in disable) the grid for performance reasons when not required to be displayed.
Setting the StoreID on the grid and moving it outside of the <Store> tags works ok except when putting the store in a layout.
I have included below a modifed version of the buffered grid example that throws and error that 'me.store' is undefined.
Leaving the store within the grid panel tag and setting Enabled="False" on the grid causes the store to not be sent to the client and so cannot then be accessed.
I'm not sure how best to proceed...
Setting the StoreID on the grid and moving it outside of the <Store> tags works ok except when putting the store in a layout.
I have included below a modifed version of the buffered grid example that throws and error that 'me.store' is undefined.
Leaving the store within the grid panel tag and setting Enabled="False" on the grid causes the store to not be sent to the client and so cannot then be accessed.
I'm not sure how best to proceed...
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Linq" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = this.TestData(5000);
this.Store1.DataBind();
}
}
private object[] TestData(int count)
{
var firstNames = new string[] { "Ed", "Tommy", "Aaron", "Abe", "Jamie", "Adam", "Dave", "David", "Jay", "Nicolas", "Nige" };
var lastNames = new string[] { "Spencer", "Maintz", "Conran", "Elias", "Avins", "Mishcon", "Kaneda", "Davis", "Robinson", "Ferrero", "White" };
var ratings = new int[] { 1, 2, 3, 4, 5 };
var salaries = new int[] { 100, 400, 900, 1500, 1000000 };
var data = new object[count];
var rnd = new Random();
for (int i = 0; i < count; i++)
{
var ratingId = rnd.Next(ratings.Length);
var salaryId = rnd.Next(salaries.Length);
var firstNameId = rnd.Next(firstNames.Length);
var lastNameId = rnd.Next(lastNames.Length);
var rating = ratings[ratingId];
var salary = salaries[salaryId];
var name = String.Format("{0} {1}", firstNames[firstNameId], lastNames[lastNameId]);
data[i] = new object[] { name, rating, salary };
}
return data;
}
</script>
<!DOCTYPE html>
<html>
<head runat="server">
<title>Buffered Scrolling - Ext.NET Examples</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<h1>Buffered Scrolling</h1>
<p>Ext.Net 2's brand new grid supports infinite scrolling, which enables you to load any number of records into a grid without paging.</p>
<p>The new grid uses a virtualized scrolling system to handle potentially infinite data sets without any impact on client side performance.</p>
<p>This example illustrates loading of all the records up front and buffering the rendering.</p>
<ext:Panel runat="server" Layout="BorderLayout" Width="800" Height="500">
<Items>
<ext:Panel runat="server" Region="Center">
<Content>Some Content
<ext:Store ID="Store1" runat="server" PageSize="5000" Buffered="true">
<Model>
<ext:Model runat="server">
<Fields>
<ext:ModelField Name="name" />
<ext:ModelField Name="rating" Type="Int" />
<ext:ModelField Name="salary" Type="Float" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Content>
</ext:Panel>
<ext:GridPanel runat="server" Title="Bufffered Grid of 5,000 random records" DisableSelection="true" Width="300" StoreID="Store1" Region="East">
<View>
<ext:GridView runat="server" TrackOver="false" />
</View>
<ColumnModel runat="server">
<Columns>
<ext:RowNumbererColumn runat="server" Width="40" Sortable="false" />
<ext:Column runat="server" Text="Name" Flex="1" DataIndex="name" />
<ext:Column runat="server" Text="Rating" Width="125" DataIndex="rating" />
<ext:Column runat="server" Text="Salary" Width="125" DataIndex="salary" Align="Right">
<Renderer Format="UsMoney" />
</ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
</Items>
</ext:Panel>
</form>
</body>
</html>
Last edited by Daniil; Aug 06, 2012 at 6:29 AM.
Reason: [CLOSED]