View Full Version : How To: Render a Ext.grid.Panel only after a Form Submit

29 Aug 2014, 12:22 PM

First I want to say that I'm new to the ExtJs community and I dont have much time to implement this on my current project.

I search a lot on google and here on forums but didn't found the solution, maybe somebody can help me.

My scenario:
* I use ExtJs with an ASP.Net MVC application.

I have a Ext.TabPanel with 2 tabs, in each tab I have 2 forms with some filter fields for searching in my DB, and a Search and Clear buttons.

All extjs grid examples that I found, the render occurs on Ext.onReady (at the page load), what I need to do is:
On the load o my page, only render my search filter fields, and after I Click on "Search" button I need to call my server side method to load and render my Grid.Panel.


Button.Click = function (
myStore.load({ params: { page: 1, limit: 10} });

Its clear ? How can I do that ? I have to use listeners ?

ps: asp.net mvc examples would be great.


1 Sep 2014, 6:06 AM
100 views and nothing =(

Well, I could no do it like I wanted, but this works

buttons: [{
id: 'btnSearch',
text: 'Search',
handler: function () {
var date = Ext.getCmp('dateControl').getValue();
store.load({ params: { page: 1, limit: 10, pDate: date} });

So, on my page load my grid still renders, but without values, I only call my store load method on click event.
For now this is ok.


1 Sep 2014, 10:30 AM
May be a moot point now, but to not show the grid, add this to its config:

hidden : true

Then before your store.load() call, make it visible: