I need to do search operation.I have added a textfield and button for search.I have done this by passing the search entry which will get from text box through extraParam.When i did not search anything in the grid that has to display everything.Now my problem is that grid doesnt load the data my js looks like this
Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.form.*',
'Ext.util.*',
]);
Ext.define('MyModel', {
extend: 'Ext.data.Model',
fields: [{
name: 'id_job',
mapping: 'id_job',
type: 'int'
}, {
name: 'job_name',
mapping: 'job_name',
type: 'string'
}, {
name: 'error_message',
mapping: 'error_message',
type: 'string'
},
{
name: 'status',
mapping: 'status',
type: 'string'
},
{
name: 'starttime',
mapping: 'starttime',
type: 'string'
},
{
name: 'endtime',
mapping: 'endtime',
type: 'string'
},
{
name: 'last_updated_time',
mapping: 'last_updated_time',
type: 'string'
},
]
});
Ext.onReady(function(){
// Ext.QuickTips.init();
var store = new Ext.data.JsonStore({
model: MyModel,
proxy: new Ext.data.HttpProxy({
url: 'job_audit.php',
// method: 'GET',
type: 'ajax',
extraParams:{
JobName:'test'
},
reader:new Ext.data.JsonReader({
type:'json',
root:'jobdisplay',
totalProperty:'Count'
})
}) ,
autoLoad:false,
idProperty: 'id'
});
var formPanel=Ext.create('Ext.form.Panel', {
title: 'Search',
width:300,
bodyPadding: 10,
submitOnAction: true,
activeItem: 1,
//renderTo: Ext.getBody(),
items: [{
xtype: 'textfield',
name: 'JobName',
id:'JobName',
fieldLabel: 'JobName',
allowBlank: false,
anchor:'95%'// requires a non-empty value
}, {
xtype: 'button',
name: 'search',
fieldLabel: 'Search',
text: 'Search',
width:100,
listeners:{
click:function(){
//var textValue=formPanel.items.get('JobName').getValue();
var text=Ext.getCmp('JobName').getValue();
store.proxy.extraParams={JobName : text};
store.load();
}
}
}]
});
formPanel.render('paging-grid');
// baseParams:{task: "LISTING"}
var grid=new Ext.grid.GridPanel({
store: store,
columns: [
{
header: 'id_job',
width: 50,
hidden:true,
filterable:true,
sortable: true,
dataIndex: 'id_job'
},
{
header: 'JobName',
width: 150,
sortable: true,
dataIndex: 'job_name',
renderer:function(myValue, myDontKnow, myRecord) {
var id=myRecord.get('id_job');
return '<a href=index.php?show=JobErrors&id=' + id +'>' + myValue + '</a> ';
}
},
{
header: 'Start Time',
width: 150,
sortable: true,
dataIndex: 'starttime'
},
{
header: 'End Time',
width: 150,
sortable: true,
dataIndex: 'endtime'
},
{
header: 'tatus',
width: 200,
sortable: true,
dataIndex: 'status'
},
{
header: 'Error_Message',
width: 150,
sortable: true,
dataIndex: 'error_message'
},
{
header: 'Last_Updated_Time',
width: 150,
sortable: true,
dataIndex: 'last_updated_time'
},
],
autoExpandable:true,
stripeRows: true,
height:600,
width:950,
title:'JobDetails',
bbar: new Ext.PagingToolbar({
pageSize:25,
store: store,
displayInfo: true,
displayMsg: 'Displaying topics {0} - {1} of {2}',
emptyMsg: "No topics to display"
})
});
store.load();
grid.render('paging-grid');
});
I am getting the param values in php side , retrieve the records also but that was not loading in the grid .Where I want to load store correctly in order to get load