PDA

View Full Version : Extjs Aajax Issue



mayur gadekar
20 Jan 2011, 2:46 AM
I am getting error while rendering data to a grid using ajax call.
First i was doing an ajax call on ext load. But Issue was the data rendering was happening before Ajax request is completed.

Now i tried doing the Ajax call in Index Indicator Grid itself, fetching data which should be displayed in the grid but it throws an error "Event is null or not an object"

Can some body help me. Below is the code snippet. Is there anything wrong with the code, any better way of doing this.
I am using Grid panel

IndexIndicatorGrid = function(limitColumns){


var resultMessage;






Ext.Ajax.request({
url : 'MultIndexEnquiry.do?method=extjsAjaxMultipleIndex',
method: 'POST',
// params :{sd:startDate.value, fd:finishDate.value},
success: function ( result, request ) {

alert("if succ");

var jsonData = Ext.util.JSON.decode(result.responseText);

alert("1::"+jsonData)



resultMessage=jsonData.reportsTree;

// resultMessage = jsonData.data.result.reportsTree;

alert("resultMessage:: -->"+resultMessage);


//alert("resultMessage::"+resultMessage);
//alert("aResult::"+aResult);

fn_AKExt(resultMessage);
},
failure: function ( result, request ) {
var jsonData = Ext.util.JSON.decode(result.responseText);
var resultMessage = jsonData.data.result;

alert("Failure::");
//fn_AKExt(resultMessage, 'Error');
}
});

function fn_AKExt(resultMessage) {

alert("fn_AKExt::"+resultMessage);

function italic(value){
return '<i>' + value + '</i>';
}

//alert("1");

function change(val){
if(val > 0){
return '<span style="color:green;">' + val + '</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '</span>';
}
return val;
}

// alert("2");

function pctChange(val){
if(val > 0){
return '<span style="color:green;">' + val + '%</span>';
}else if(val < 0){
return '<span style="color:red;">' + val + '%</span>';
}
return val;
}

// alert("3");

var columns = [
{id:'exchange',header: "Exchange", width: 60, sortable: true, dataIndex: 'exchange'},
{id:'company',header: "Index", width: 160, sortable: true, dataIndex: 'company'},
{header: "Current", width: 75, sortable: true, renderer:change, dataIndex: 'price'},
{header: "Change", width: 75, sortable: true, renderer: change, dataIndex: 'change'},
{header: "% Change", width: 75, sortable: true, renderer: pctChange, dataIndex: 'pctChange'},
{header: "Indicator", width: 85, sortable: true, dataIndex: 'lastChange'}
];


alert("1");

// allow samples to limit columns
/* if(limitColumns){
var cs = [];
for(var i = 0, len = limitColumns.length; i < len; i++){
cs.push(columns[limitColumns[i]]);
}
columns = cs;
}*/

alert("222");


IndexIndicatorGrid.superclass.constructor.call(this, {
store: new Ext.data.Store({
reader: new Ext.data.ArrayReader({}, [
{name: 'exchange'},
{name: 'company'},
{name: 'price'},
{name: 'change', type: 'float'},
{name: 'pctChange',type: 'float'},
{name: 'lastChange'}
]),

data: resultMessage

}),
columns: columns,
//loadMask:true,
autoExpandColumn: 'company',
height:90,
width:300
});



alert("33");

} //fn_AKExt end

}

Ext.extend(IndexIndicatorGrid, Ext.grid.GridPanel);

/* END Index Indicator GRID */

scottmartin
20 Jan 2011, 6:23 AM
I would suggest you use FF:FireBug or Chrome's Inspect Element to debug your code by setting break points and inspecting your code and see what is actually happening at the time of execution. Using alert's in your code is not very affect for this.

Regards,
Scott.

alien3d
20 Jan 2011, 8:33 AM
learn proper exception on ajax request ...I know hard because most here just copy paste and when request ajax don't have proper exception.


Ext.Ajax.request({
url : "../data/religion_data.php",
params : {
method : "delete",
religionId : record.data.religionId,
leafId : leafId
},
success : function(response,options) {
var x = Ext
.decode(response.responseText);

if (x.success == "true") {
title = successLabel;
} else {
title = failureLabel;
}
Ext.MessageBox.alert(
systemLabel,
x.message);

},
failure : function(response, options) {
status_code = response.status;
status_message = response.statusText;
Ext.MessageBox.alert(systemErrorLabel,escape(status_code)+ ":"+ status_message);
}