Please elaborate on that.
Sorry for the late reply.
I have used
this search example with
this example of inserting data.
They both work well together but when I introduce the remote filter the searching and SQL commands seem to produce an empty grid that doesn't refresh.
Here is the code I'm using.
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Xml" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
}
private bool cancel;
private string message;
private int? insertedValue;
protected void Store1_BeforeRecordInserted(object sender, BeforeRecordInsertedEventArgs e)
{
}
protected void Store1_AfterRecordInserted(object sender, AfterRecordInsertedEventArgs e)
{
if (insertedValue.HasValue)
{
e.Keys.Add("record_id", insertedValue.Value);
insertedValue = null;
}
}
protected void SqlDataSource1_Inserted(object sender, SqlDataSourceStatusEventArgs e)
{
if(e.AffectedRows > 0 && e.Command.Parameters["@newId"].Value != null)
{
insertedValue = (int)e.Command.Parameters["@newId"].Value;
}
else
{
insertedValue = null;
}
}
protected void Store1_AfterDirectEvent(object sender, AfterDirectEventArgs e)
{
if (e.Response.Success)
{
// set to .Success to false if we want to return a failure
e.Response.Success = !cancel;
e.Response.Message = message;
}
}
protected void Store1_Refresh(object sender, StoreReadDataEventArgs e)
{
Store store = this.GridPanel1.GetStore();
store.DataBind();
}
protected void Store1_BeforeDirectEvent(object sender, BeforeDirectEventArgs e)
{
}
</script>
<link href="/resources/css/examples.css" rel="stylesheet" />
<style>
.x-grid-row-over .x-grid-cell-inner {
font-weight : bold;
}
.x-yellow-highlight
{
background-color: yellow;
}
</style>
<script>
var template = '<span style="color:{0};">{1}</span>';
var change = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value);
};
var pctChange = function (value) {
return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
};
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<title>TPS List</title>
</head>
<body>
<form id="Form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<asp:SqlDataSource
ID="SqlDataSource1"
runat="server"
ConnectionString="<%$ ConnectionStrings:databaseConnection %>"
DeleteCommand="DELETE FROM tps WHERE (record_id = @record_id)"
InsertCommand="INSERT INTO tps
(number)
VALUES
(@number);
SELECT @newId = @@Identity;"
SelectCommand="SELECT
record_id,
number,
CONVERT(VARCHAR(19),date_entered) [date_entered],
CONVERT(VARCHAR(19),date_removed) [date_removed],
active
FROM tps"
UpdateCommand="UPDATE tps SET
number = @number,
last_modified_date = GETDATE(),
--only show a removed date if active is unticked and it was previously set to true in the database
date_removed = (CASE WHEN @active = 'false' AND active = 'true' THEN GETDATE() ELSE NULL END),
active = @active
WHERE (record_id = @record_id)"
OnInserted="SqlDataSource1_Inserted">
<DeleteParameters>
<asp:Parameter Name="record_id" Type="Int32" />
</DeleteParameters>
<UpdateParameters>
<asp:Parameter Name="number" Type="String" />
<asp:Parameter Name="record_id" Type="Int32" />
</UpdateParameters>
<InsertParameters>
<asp:Parameter Name="number" Type="String" />
<asp:Parameter Direction="Output" Name="newId" Type="Int32" />
</InsertParameters>
</asp:SqlDataSource>
<ext:Store
ID="Store1"
runat="server"
Buffered="true"
RemoteFilter="true"
LeadingBufferZone="100"
PageSize="50"
DataSourceID="SqlDataSource1"
ShowWarningOnFailure="false"
OnAfterDirectEvent="Store1_AfterDirectEvent"
OnBeforeDirectEvent="Store1_BeforeDirectEvent"
OnBeforeRecordInserted="Store1_BeforeRecordInserted"
OnAfterRecordInserted="Store1_AfterRecordInserted"
OnReadData="Store1_Refresh">
<Proxy>
<ext:PageProxy />
</Proxy>
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="record_id" Name="Supplier">
<Fields>
<ext:ModelField Name="record_id" Type="Int" />
<ext:ModelField Name="number" />
<ext:ModelField Name="date_entered" />
<ext:ModelField Name="date_removed" />
<ext:ModelField Name="active" />
</Fields>
</ext:Model>
</Model>
<Sorters>
<ext:DataSorter Property="number" Direction="ASC" />
</Sorters>
<Listeners>
<Exception Handler="Ext.Msg.alert('Operation failed', operation.getError());" />
<Write Handler="Ext.Msg.alert('Write', 'The data successfully saved');" />
</Listeners>
</ext:Store>
<ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout">
<Items>
<ext:Panel ID="Panel2" runat="server" Region="Center" Height="300" Header="false" Layout="Fit" MarginsSummary="0 5 0 5">
<Items>
<ext:GridPanel ID="GridPanel1" runat="server" Title="TPS List" StoreID="Store1" Border="false" Icon="Phone">
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column ID="colNumber" runat="server" DataIndex="number" Text="Number" Flex="1" >
<Editor>
<ext:NumberField ID="NumberField1" runat="server" />
</Editor>
</ext:Column>
<ext:Column ID="colDateEntered" runat="server" DataIndex="date_entered" Text="Date Added" Flex="1" />
<ext:Column ID="colDateRemoved" runat="server" DataIndex="date_removed" Text="Date Removed" Flex="1" />
<ext:CheckColumn ID="chkActive" runat="server" DataIndex="active" Header="Active" Width="50" Sortable="true" Editable="true" />
</Columns>
</ColumnModel>
<TopBar>
<ext:LiveSearchToolbar ID="LiveSearchToolbar1" runat="server" HideRegExp="true" HideCaseSensitive="true" />
</TopBar>
<BottomBar>
<ext:StatusBar ID="StatusBar1" runat="server" DefaultText="Nothing Found" />
</BottomBar>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Multi" />
</SelectionModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server" />
<ext:LiveSearchGridPanel runat="server">
<Listeners>
<RegExpError Handler="#{StatusBar1}.setStatus({text: message, iconCls: 'x-status-error'});" />
<BeforeSearch Handler="#{StatusBar1}.setStatus({text: 'Nothing Found', iconCls: ''});" />
<Search Handler="if(count>0){#{StatusBar1}.setStatus({text: count + ' matche(s) found.', iconCls: 'x-status-valid'});}" />
</Listeners>
</ext:LiveSearchGridPanel>
</Plugins>
</ext:GridPanel>
</Items>
<Buttons>
<ext:Button ID="btnSave" runat="server" Text="Sync" Icon="Disk" >
<Listeners>
<Click Handler="#{Store1}.sync();" />
</Listeners>
</ext:Button>
<ext:Button ID="btnDelete" runat="server" Text="Delete selected records" Icon="Delete">
<Listeners>
<Click Handler="#{GridPanel1}.deleteSelected();" />
</Listeners>
</ext:Button>
<ext:Button ID="btnInsert" runat="server" Text="Insert" Icon="Add">
<Listeners>
<Click Handler="#{Store1}.insert(0, new Supplier());#{GridPanel1}.editingPlugin.startEditByPosition({row:0, column:0});" />
</Listeners>
</ext:Button>
<ext:Button ID="btnRefresh" runat="server" Text="Refresh" Icon="ArrowRefresh">
<Listeners>
<Click Handler="#{Store1}.reload({params:{EmulateError: 0}});" />
</Listeners>
</ext:Button>
</Buttons>
</ext:Panel>
</Items>
</ext:Viewport>
</form>
</body>
</html>
