Nov 15, 2008, 9:10 AM
[FIXED] [V0.7] When the initial data set is empty, GridPanel refuses to load data on subsequent refresh
Hello,
I have the configuration similar to GridPanel/DataSource Controls/Paging & Sorting example. The difference is that I do not populate the grid when the application starts, but rather as a result of a user interaction. The problem is that the grid never shows any data, even if it is available later from the data source.
I have modified your example to illustrate this. The steps to reproduce are as follows:
- after starting the application the grid is empty, which is all right, because the data source is not returning any results
- check the check box at the top of the page and hit the refresh button
- The grid is still empty, although you can check in the debugger, that a couple of rows were returned by the data source. I would expect them to appear on the grid. Additionally an error shows (I have added a Load listener), which under FireFox says: "Load failed: this.getTotal is not a function".
Here are the modified files from from the mentioned sample:
Default.aspx:
The modified method from the EntitiesAdditions.cs (Employee.GetEmployeesFilter):
Tadeusz Dracz
I have the configuration similar to GridPanel/DataSource Controls/Paging & Sorting example. The difference is that I do not populate the grid when the application starts, but rather as a result of a user interaction. The problem is that the grid never shows any data, even if it is available later from the data source.
I have modified your example to illustrate this. The steps to reproduce are as follows:
- after starting the application the grid is empty, which is all right, because the data source is not returning any results
- check the check box at the top of the page and hit the refresh button
- The grid is still empty, although you can check in the debugger, that a couple of rows were returned by the data source. I would expect them to appear on the grid. Additionally an error shows (I have added a Load listener), which under FireFox says: "Load failed: this.getTotal is not a function".
Here are the modified files from from the mentioned sample:
Default.aspx:
<%@ Page Language="C#" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Coolite Toolkit - GridPanel with ObjectDataSource</title>
<link href="/resources/css/examples.css" rel="stylesheet" type="text/css" />
<script runat="server">
protected void Store1_RefreshData( object sender, StoreRefreshDataEventArgs e )
{
ObjectDataSource1.SelectParameters["load"].DefaultValue = e.Parameters["test"];
ObjectDataSource1.SelectParameters["start"].DefaultValue = e.Start.ToString();
ObjectDataSource1.SelectParameters["limit"].DefaultValue = e.Limit.ToString();
ObjectDataSource1.SelectParameters["sort"].DefaultValue = e.Sort;
ObjectDataSource1.SelectParameters["dir"].DefaultValue = e.Dir.ToString();
Store1.DataBind();
}
protected void ObjectDataSource1_Selected( object sender, ObjectDataSourceStatusEventArgs e )
{
( this.Store1.Proxy[0] as DataSourceProxy ).TotalCount = (int) e.OutputParameters["count"];
}
</script>
<style type="text/css">
.x-grid3-td-fullName .x-grid3-cell-inner
{
font-family: tahoma, verdana;
display: block;
font-weight: normal;
font-style: normal;
color: #385F95;
white-space: normal;
}
.x-grid3-row-body p
{
margin: 5px 5px 10px 5px !important;
width: 99%;
color: Gray;
}
</style>
<script type="text/javascript">
var fullName = function(value, metadata, record, rowIndex, colIndex, store)
{
return '' + record.data.LastName + ' ' + record.data.FirstName + '';
};
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" />
<ext:Checkbox ID="CheckBox1" runat="server" Checked="false">
</ext:Checkbox>
<asp:ObjectDataSource ID="ObjectDataSource1" runat="server" OnSelected="ObjectDataSource1_Selected"
SelectMethod="GetEmployeesFilter" TypeName="Coolite.Examples.Code.Northwind.Employee">
<SelectParameters>
<asp:Parameter Name="load" Type="Boolean" />
<asp:Parameter Name="start" Type="Int32" />
<asp:Parameter Name="limit" Type="Int32" />
<asp:Parameter Name="sort" />
<asp:Parameter Name="dir" />
<asp:Parameter Name="count" Direction="Output" Type="Int32" />
</SelectParameters>
</asp:ObjectDataSource>
<ext:Store ID="Store1" runat="server" AutoLoad="true" RemoteSort="true" DataSourceID="ObjectDataSource1"
OnRefreshData="Store1_RefreshData">
<BaseParams>
<ext:Parameter Name="test" Mode="Raw" Value="#{CheckBox1}.checked" />
</BaseParams>
<AutoLoadParams>
<ext:Parameter Name="start" Value="={0}" />
<ext:Parameter Name="limit" Value="={3}" />
</AutoLoadParams>
<Proxy>
<ext:DataSourceProxy />
</Proxy>
<Reader>
<ext:JsonReader ReaderID="EmployeeID">
<Fields>
<ext:RecordField Name="FirstName" />
<ext:RecordField Name="LastName" />
<ext:RecordField Name="Title" />
<ext:RecordField Name="TitleOfCourtesy" />
<ext:RecordField Name="BirthDate" Type="Date" />
<ext:RecordField Name="HireDate" Type="Date" />
<ext:RecordField Name="Address" />
<ext:RecordField Name="City" />
<ext:RecordField Name="Region" />
<ext:RecordField Name="PostalCode" />
<ext:RecordField Name="Country" />
<ext:RecordField Name="HomePhone" />
<ext:RecordField Name="Extension" />
<ext:RecordField Name="Notes" />
</Fields>
</ext:JsonReader>
</Reader>
<Listeners>
<LoadException Handler="var e = e || {message: response.responseText}; alert('Load failed: ' + e.message);" />
</Listeners>
</ext:Store>
<ext:GridPanel runat="server" ID="GridPanel1" Title="Employees" Frame="true" StoreID="Store1"
Height="300">
<ColumnModel runat="server">
<Columns>
<ext:Column ColumnID="fullName" Header="Full Name" Width="150" DataIndex="LastName">
<Renderer Fn="fullName" />
</ext:Column>
<ext:Column DataIndex="Title" Header="Title" Width="150" />
<ext:Column DataIndex="TitleOfCourtesy" Header="Title Of Courtesy" Width="150" />
<ext:Column DataIndex="BirthDate" Header="BirthDate" Width="110">
<Renderer Fn="Ext.util.Format.dateRenderer('Y-m-d')" />
</ext:Column>
<ext:Column DataIndex="HireDate" Header="HireDate" Width="110">
<Renderer Fn="Ext.util.Format.dateRenderer('Y-m-d')" />
</ext:Column>
<ext:Column DataIndex="Address" Header="Address" Width="150" />
<ext:Column DataIndex="City" Header="City" Width="100" />
<ext:Column DataIndex="Region" Header="Region" Width="100" />
<ext:Column DataIndex="PostalCode" Header="PostalCode" Width="100" />
<ext:Column DataIndex="Country" Header="Country" Width="100" />
<ext:Column DataIndex="HomePhone" Header="HomePhone" Width="150" />
<ext:Column DataIndex="Extension" Header="Extension" Width="100" />
</Columns>
</ColumnModel>
<View>
<ext:GridView runat="server" EnableRowBody="true">
<GetRowClass Handler="rowParams.body = '<p>'+record.data.Notes+'</p>'; return 'x-grid3-row-expanded';" />
</ext:GridView>
</View>
<SelectionModel>
<ext:RowSelectionModel runat="server" />
</SelectionModel>
<BottomBar>
<ext:PagingToolBar ID="PagingToolBar1" runat="server" PageSize="3" StoreID="Store1"
DisplayInfo="true" DisplayMsg="Displaying employees {0} - {1} of {2}" EmptyMsg="No employees to display" />
</BottomBar>
<LoadMask ShowMask="true" />
</ext:GridPanel>
</form>
</body>
</html>
The modified method from the EntitiesAdditions.cs (Employee.GetEmployeesFilter):
public static List<Employee> GetEmployeesFilter(bool load, int start, int limit, string sort, string dir, out int count)
{
if ( !load )
{
count = 0;
return new List<Employee>();
}
NorthwindDataContext db = new NorthwindDataContext();
// ... The rest of the code remains unchanged
}
Regards, Tadeusz Dracz