Setting GridPanel datasource on button click rather than on page load

  1. #1

    Setting GridPanel datasource on button click rather than on page load

    I have a grid that I'm wanting to refresh the datasource when the user clicks a button on the screen. The button is a search button that brings back results based on criteria on the screen.

    I noticed that the grid only shows data based on databinding at the time of page load rather than trying to set databinding on the click of a button.

    I try setting the following on the click event, but the grid still shows the data that was loaded on the page load event.

                this.Store1.DataSource = transData;
                if (Ext.IsAjaxRequest) )
    How can I get the grid to refresh on the click event of a button?

         <ext:GridPanel ID="GridPanel1" 
                Title="Array Grid"            
                    <ext:RowSelectionModel ID="SearchResultSelection" runat="server" SingleSelect="True" />
                <LoadMask ShowMask="true" />
                    <Command Handler="Coolite.AjaxMethods.GridCommand(command, this.getColumnModel().getDataIndex(colIndex),, rowIndex )" />                  
                    <RowMouseDown Handler="Coolite.AjaxMethods.RowSelected(rowIndex);" />
                    <KeyDown Handler="Coolite.AjaxMethods.GridKeyDown()" />
                <ext:Button ID="btnSearch" runat="server" Text="Search" >
                            <Click OnEvent="btnSearch2" >           
    Last edited by geoffrey.mcgill; Oct 12, 2010 at 9:41 PM. Reason: please use [CODE] tags
  2. #2

    For the future please read this guide

    In particular wrap any code in [CODE] tags.

    The following code works fine in Ext.Net 1.0.
    BTW, I would suggest you to migrate to this toolkit's version as soon as possible. It's much more powerful and flexible toolkit than previous ones.

    Example Ext.Net 1.0
    <%@ Page Language="C#" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
            if (!X.IsAjaxRequest)
                Store store = this.GridPanel1.GetStore();
                store.DataSource = new object[] { 
                                             new object[] { "test1" },
                                             new object[] { "test2" },
                                             new object[] { "test3" }
        protected void UpdateGrid(object sender, DirectEventArgs e)
            Store store = this.GridPanel1.GetStore();
            store.DataSource = new object[] { 
                                             new object[] { "new test1" },
                                             new object[] { "new test2" },
                                             new object[] { "new test3" }
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    <html xmlns="">
    <head runat="server">
        <title>Ext.Net Example</title>
        <form runat="server">
        <ext:ResourceManager runat="server" />
        <ext:GridPanel ID="GridPanel1" runat="server" AutoHeight="true">
                <ext:Store runat="server">
                                <ext:RecordField Name="test" />
            <ColumnModel runat="server">
                    <ext:Column Header="Test" DataIndex="test" />
        <ext:Button runat="server" Text="Update the grid" OnDirectClick="UpdateGrid" />
    If this example won't help you please post your sample code in the above manner.

Similar Threads

  1. Replies: 0
    Last Post: May 08, 2012, 1:57 PM
  2. Replies: 4
    Last Post: Jan 04, 2012, 5:38 AM
  3. Replies: 2
    Last Post: Dec 20, 2011, 9:18 AM
  4. Replies: 0
    Last Post: Jul 23, 2010, 7:35 AM
  5. Replies: 2
    Last Post: Dec 22, 2008, 7:08 AM

Posting Permissions