I have form and grid. the user must enter data in form fields then display related records in the grid. I want to implement a search form, e.g: user will type the name and gender of the student, then will get a grid of all students have the same name and gender.
So, I use ajax to send form fields value to PHP and then creat a json_encode wich will be used in grid store.
I am really not sure if my idea is good. But I haven't found another way to do that.
The problem is when I set autoLoad to true in the store, the grid automatically filled with all data - not just what I asked for -
So, I understand that I have to set autoLoad to false, but then the result not shown in the grid even it returned successfully in the firebug!
I don't know what to do.
My View:
{
xtype: 'panel',
layout: "fit",
id: 'searchResult',
flex: 7,
title: '<div style="text-align:center;"/>SearchResultGrid</div>',
items: [
{
xtype: 'gridpanel',
store: 'advSearchStore', id: 'AdvSearch-grid',
columns: [
{
xtype: 'gridcolumn',
dataIndex: 'name',
align: 'right',
text: 'name'
},
{
xtype: 'gridcolumn',
dataIndex: 'gender',
align: 'right',
text: 'gender'
}
],
viewConfig: {
id : 'Arr'
,emptyText: 'noResult'
},
requires: ['MyApp.PrintSave_toolbar'],
dockedItems: [
{
xtype: 'PrintSave_tb',
dock: 'bottom',
}
]
}
]
},
My Store and Model:
Ext.define('AdvSearchPost', {
extend: 'Ext.data.Model',
proxy: {
type: 'ajax',
url: 'AdvSearch.php',
reader: {
type: 'json',
root: 'Arr',
totalProperty: 'totalCount'
}
},
fields: [
{ name: 'name'},
{ name: 'type_and_cargo'}
]
});
Ext.create('Ext.data.Store', {
pageSize: 10,
autoLoad: false,
model: 'AdvSearchPost',
storeId: 'AdvSearchPost'
});
