Aug 24, 2009, 1:26 PM
Refresh data in Store, form and paging toolbar
Hi,
I have created a search page where users can search the database by a serial number or email address and other parameters.
The data binding works great. If my Store has 200 records and I browse through the records, then search another record by any parameters, the form and pager toolbar won't refresh unless I click "Go First Record" icon on pager, then I can see the record and pager displays right count.
Am I missing something here? Can you help please?
I have created a search page where users can search the database by a serial number or email address and other parameters.
The data binding works great. If my Store has 200 records and I browse through the records, then search another record by any parameters, the form and pager toolbar won't refresh unless I click "Go First Record" icon on pager, then I can see the record and pager displays right count.
Am I missing something here? Can you help please?
<asp:UpdatePanel runat="server">
<ContentTemplate>
<asp:ObjectDataSource ID="dssearch" runat="server"
OldValuesParameterFormatString="original_{0}" SelectMethod="Respondent"
TypeName="SearchEnging.search">
<SelectParameters>
<asp:Parameter Name="lookup" Type="String" />
<asp:Parameter Name="searchvalue" Type="String" />
<asp:Parameter Name="matchoption" Type="String" />
</SelectParameters>
</asp:ObjectDataSource>
<ext:Store ID="StoreSearch" runat="server" OnRefreshData="StoreSearch_RefreshData">
<Reader>
<ext:JsonReader ReaderID="SerialNumber">
<Fields>
<ext:RecordField Name="Title"></ext:RecordField>
<ext:RecordField Name="Name1"></ext:RecordField>
<ext:RecordField Name="Name2"></ext:RecordField>
<ext:RecordField Name="Street1"></ext:RecordField>
<ext:RecordField Name="Street2"></ext:RecordField>
<ext:RecordField Name="Town"></ext:RecordField>
<ext:RecordField Name="County"></ext:RecordField>
<ext:RecordField Name="Postcode"></ext:RecordField>
</Fields>
</ext:JsonReader>
</Reader>
<Listeners>
<DataChanged Handler="var record = this.getAt(0) || {};#{formresearch}.getForm().loadRecord(record);" />
<BeforeLoad Handler="#{formresearch}.body.mask('Loading...', 'x-mask-loading');" />
<Load Handler="#{formresearch}.body.unmask();" />
<LoadException Handler="#{formresearch}.body.unmask();" />
</Listeners>
</ext:Store>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel runat="server">
<ContentTemplate>
<ext:ViewPort ID="ViewPort1" runat="server">
<Body>
<ext:BorderLayout ID="BorderLayout1" runat="server">
<North Collapsible="false" Split="false" MinHeight="150" MaxHeight="150">
<ext:Panel ID="Panel1" runat="server" Height="150" Title="Search Cretiria" BodyStyle="padding: 5px; background-color: #336699; color: #ffffff">
<Body>
<div style="color: #FFCC00">Select an option:
<ext:RadioGroup ID="optlookin" runat="server" Vertical="false" ColumnsNumber = "10">
<Items>
<ext:Radio runat="server" ID="optsn" BoxLabel="Serial" Checked="true">
</ext:Radio>
<ext:Radio runat="server" ID="opttel" BoxLabel="Telephone" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optmobile" BoxLabel="Mobile" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optemail" BoxLabel="Email" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optsurname" BoxLabel="Surname" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optaddress" BoxLabel="Address" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optpostcode" BoxLabel="Postcode" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="opttown" BoxLabel="Town" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optcati" BoxLabel="Cati" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optinterview" BoxLabel="Interview" Checked="false"></ext:Radio>
</Items>
</ext:RadioGroup>
<div style="color: #FFCC00">Select a match:
<ext:RadioGroup ID="optmatch" runat="server" Vertical="false" >
<Items>
<ext:Radio runat="server" ID="optwhole" BoxLabel="Whole field" Checked="true" ></ext:Radio>
<ext:Radio runat="server" ID="optstart" BoxLabel="Start of field" Checked="false" ></ext:Radio>
<ext:Radio runat="server" ID="optany" BoxLabel="Any part of field" Checked="false" ></ext:Radio>
</Items>
</ext:RadioGroup>
</Body>
<BottomBar>
<ext:Toolbar runat="server">
<Items>
<ext:TextField runat="server" ID="txtsearch" AllowBlank="false" Width="250" EmptyText="Enter a value here" SelectOnFocus="true" ></ext:TextField>
<ext:ToolbarSpacer></ext:ToolbarSpacer>
<ext:ToolbarButton runat="server" ID="btnsearch" Text="Search" Icon="Magnifier">
<AjaxEvents>
<Click OnEvent="btnsearch_Click">
<EventMask ShowMask="true" Msg="Searching..." />
</Click>
</AjaxEvents>
</ext:ToolbarButton>
</Items>
</ext:Toolbar>
</BottomBar>
</ext:Panel>
</North>
<Center>
<ext:Panel ID="Panel7" runat="server" >
<Body>
<ext:FitLayout ID="FitLayout2" runat="server">
<ext:FormPanel ID="formresearch" runat="server" BodyStyle="padding:5px;" ButtonAlign="Right"
Frame="true" Height="185" Width="300">
<Body>
<ext:FormLayout ID="FormLayout1" runat="server">
<ext:Anchor>
<ext:MultiField ID="mfldname" runat="server" HideLabel="true" >
<Fields>
<ext:TextField runat="server" ID="txttitle" Width="50" ReadOnly="true" DataIndex="Title" Note="Title"></ext:TextField>
<ext:TextField runat="server" ID="txtname" Width="70" ReadOnly="true" DataIndex="Name1" Note="Name"></ext:TextField>
<ext:TextField runat="server" ID="txtsurname" Width="100" ReadOnly="true" DataIndex="Name2" Note="Surname"></ext:TextField>
<ext:TextField runat="server" ID="txttelephone" Width="140" ReadOnly="true" DataIndex="Telephone" Note="Telephone"></ext:TextField>
<ext:TextField runat="server" ID="txtmobile" Width="140" ReadOnly="true" DataIndex="MobileNo" Note="Mobile"></ext:TextField>
<ext:TextField runat="server" ID="txtemail" Width="200" ReadOnly="true" DataIndex="EmailAdd" Note="Email"></ext:TextField>
</Fields>
</ext:MultiField>
</ext:Anchor>
<ext:Anchor>
<ext:MultiField ID="mfldaddress" runat="server" HideLabel="true">
<Fields>
<ext:TextField runat="server" ID="txtadd1" Width="200" ReadOnly="true" DataIndex="Street1" Note="Address 1"></ext:TextField>
<ext:TextField runat="server" ID="txtadd2" Width="200" ReadOnly="true" DataIndex="Street2" Note="Address 2"></ext:TextField>
<ext:TextField runat="server" ID="txttown" Width="100" ReadOnly="true" DataIndex="Town" Note="Town"></ext:TextField>
<ext:TextField runat="server" ID="txtcounty" Width="100" ReadOnly="true" DataIndex="County" Note="County"></ext:TextField>
<ext:TextField runat="server" ID="txtpostcode" Width="100" ReadOnly="true" DataIndex="Postcode" Note="Postcode"></ext:TextField>
</Fields>
</ext:MultiField>
</ext:Anchor>
</ext:FormLayout>
</Body>
<LoadMask ShowMask="true" Msg="Reading..." />
<BottomBar>
<ext:PagingToolbar runat="server" PageSize="1" ID="tlbpagebar" StoreID="StoreSearch" >
</ext:PagingToolbar>
</BottomBar>
</ext:FormPanel>
</ext:FitLayout>
</Body>
</ext:Panel>
</Center>
</ext:BorderLayout>
</Body>
</ext:ViewPort>
</ContentTemplate>
</asp:UpdatePanel>
protected void Page_Load(object sender, EventArgs e)
{
if (!Ext.IsAjaxRequest)
{ GetData(); }
}
protected void StoreSearch_RefreshData(object sender, Coolite.Ext.Web.StoreRefreshDataEventArgs e)
{
GetData();
}
protected void btnsearch_Click(object sender, Coolite.Ext.Web.AjaxEventArgs e)
{
GetData();
}
private void GetData()
{
string optsearchvalue = txtsearch.Text;
dssearch.SelectParameters[0].DefaultValue = GetSearchLookup();
dssearch.SelectParameters[1].DefaultValue = optsearchvalue;
dssearch.SelectParameters[2].DefaultValue = GetSearchMatch();
StoreSearch.DataSourceID = "dssearch";
StoreSearch.DataBind();
this.tlbpagebar.DataBind();
}
private string GetSearchMatch()
{
string optsearchmatch = string.Empty;
if (this.optwhole.Checked == true)
{ optsearchmatch = "WholeField"; }
if (this.optstart.Checked == true)
{ optsearchmatch = "StartWith"; }
if (this.optany.Checked == true)
{ optsearchmatch = "AnyPartOfField"; }
return optsearchmatch;
}
private string GetSearchLookup()
{
string optsearchlookup = string.Empty;
if (this.optaddress.Checked == true)
{
optsearchlookup = "Address";
}
if (this.optcati.Checked == true)
{ optsearchlookup = "Cati"; }
if (this.optemail.Checked == true)
{ optsearchlookup = "Email"; }
if (this.optinterview.Checked == true)
{ optsearchlookup = "Interview"; }
if (this.optmobile.Checked == true)
{ optsearchlookup = "Mobile"; }
if (this.optpostcode.Checked == true)
{ optsearchlookup = "Postcode"; }
if (this.optsn.Checked == true)
{ optsearchlookup = "SerialNumber"; }
if (this.optsurname.Checked == true)
{ optsearchlookup = "Surname"; }
if (this.opttel.Checked == true)
{ optsearchlookup = "Telephone"; }
if (this.opttown.Checked == true)
{ optsearchlookup = "Town"; }
return optsearchlookup;
}