PDA

View Full Version : EXT-JS with jsp of java



dtrprasad
25 May 2012, 2:45 AM
my js file is



Ext.require('Ext.data.JsonStore');
Ext.require('Ext.grid.GridPanel');
Ext.onReady(function() {


alert('jjjj');


var store = new Ext.data.JsonStore({
url: 'devList.jsp',
root: 'developers',
idProperty: 'devId',
fields:[
{name:'devId',type:'int'},
{name:'name'},
{name:'area'},
{name:'rank'},
{name:'ambition'}
]
});

store.load();
alert('kkkk');




var myGrid = new Ext.grid.GridPanel({
store: store,
columns: [
{id: 'devId',header: 'DEVELOPER-ID',width: 100,sortable: true,dataIndex: 'devId'},
{header: 'NAME',width: 100,dataIndex: 'name'},
{header: 'AREA',width: 100,dataIndex: 'area'},
{header: 'RANK',width: 100,dataIndex: 'rank'},
{header: 'AMBITION',width: 200,dataIndex: 'ambition'}
],
stripeRows: true,
width:650,
height:200,
title:'Developers-Details'
});
myGrid.render('db-grid');
});


the data is coming from jsp is


{ developers: [{devId: 100,name: 'Saravanan',area: 'JEE',rank: 'JE',ambition:'to go to Singapore as Java Developer'},{devId: 110,name: 'Madhavan',area: 'Main Frames',rank: 'JT',ambition:'to go to USA as IBM Developer'},{devId: 120,name: 'Kuselan',area: '.Net',rank: 'JE',ambition:'to go to Australia as .Net Developer'},{devId: 130,name: 'Mohana Priya',area: 'JEE',rank: 'JP',ambition:'to go to Australia as Java Developer'},{devId: 140,name: 'Tamilarasi',area: 'Java',rank: 'JE',ambition:'to settle in Chennai as Java Developer'},{devId: 150,name: 'Divya',area: '.Net',rank: 'JE',ambition:'to go to Dubai as .Net Developer'}]}


i am getting an error in Google chrome as

Uncaught TypeError: Cannot call method 'indexOf' of undefined line no21 of ext-all.js


i had used ext-all.js or ext-all-debug.js same is error

what i should correct any part of output of jsp

from
dtrprasad@gmail.com

scottmartin
25 May 2012, 2:46 PM
Please have a look at the following changes:



<?php

echo '{
"developers": [
{
"devId": 100,
"name": "Saravanan",
"area": "JEE",
"rank": "JE",
"ambition": "togotoSingaporeasJavaDeveloper"
},
{
"devId": 110,
"name": "Madhavan",
"area": "MainFrames",
"rank": "JT",
"ambition": "togotoUSAasIBMDeveloper"
}
]
}';

?>




Ext.onReady(function() {

Ext.define('model', {
extend: 'Ext.data.Model',
idProperty: 'devId',

fields:[
{name:'devId',type:'int'},
{name:'name'},
{name:'area'},
{name:'rank'},
{name:'ambition'}
],

proxy: {
type: 'rest',
url: 'server.php',
reader: {
type: 'json',
root: 'developers',
totalProperty: 'total'
}
}
});

var store = Ext.create('Ext.data.Store', {
autoLoad: true,
type: 'json',
model: 'model'
});

//store.load();

var myGrid = new Ext.grid.GridPanel({
store: store,
columns: [
{id: 'devId',header: 'DEVELOPER-ID',width: 100,sortable: true,dataIndex: 'devId'},
{header: 'NAME',width: 100,dataIndex: 'name'},
{header: 'AREA',width: 100,dataIndex: 'area'},
{header: 'RANK',width: 100,dataIndex: 'rank'},
{header: 'AMBITION',width: 200,dataIndex: 'ambition'}
],
stripeRows: true,
width:650,
height:200,
title:'Developers-Details',
renderTo: Ext.getBody()
});

});


Regards,
Scott.