PDA

View Full Version : Combobox does not list the values



Vivek_Madapura_V
7 Sep 2010, 9:20 PM
Hello,

I am new to extjs and struts2.
I need to load a set of values from the server into a combobox inside a grid.
The appropriate method is invoked (twice, I wonder why!!) at the server side on request, however at the browser side, the combobox is still empty.

Any help is appreciated

my jsp


<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript" src="/Project/javaScript/createWP.js"></script>
</head>
<body>
<div id="loadWP">
</div>



my java script



Ext.onReady(function() {
// Initiate the quick tips.
Ext.QuickTips.init();

var jsonReaderSuperWP = new Ext.data.JsonReader( {
root : 'superwps',
idProperty : 'id',
successProperty : 'success',
totalProperty : 'total',
fields : [ {
name : 'id'
}, {
name : 'swpName'
}, {
name : 'lowerLimit'
}, {
name : 'upperLimit'
}, {
name : 'category'
}, {
name : 'description'
} ]
});


var superWPDataStore = new Ext.data.JsonStore( {
storeId: 'super-wps',

baseParams : {

type : "json",

searchall : true
},
url : "getallswps.action",
method : 'POST',
reader : jsonReaderSuperWP

});



var wpForm = new Ext.FormPanel( {
standardSubmit : true,

url : 'createWP',

labelAlign : 'left',
collapsible : true,
title : WP details',
bodyStyle : 'padding:5px',

width : 970,
items : [ {
layout : 'column',
border : false,
items : [ {
// removed other fields
columnWidth : 0.5,


layout : 'form',

border : false,
items : [ {
xtype : 'combo',
fieldLabel : 'Workpackage Category',
name : 'category',
anchor : '93%',
allowBlank:false,
store:superWPDataStore,
loadingText: "loading",
displayField:'category',
valueField:'category',
mode: 'remote',
triggerAction: 'all',
typeAhead: true,
selectOnFocus:false,
forceSelection:true,
minChars: 3,
lazyRenderer: true,
resizable:true,
emptyText: "select"
} ]
// removed other fields

} ],
buttons : [ {


text : 'Save',

}, {
text : 'Cancel',
} ]

});


wpForm.render('loadWP');
alert(superWPDataStore.getTotalCount()); // This says total count is zero even if I set "autoLoad: true" for the store !



my Action class




public class SuperWorkPackageAction extends ActionSupport {


/**

*

*/
private Integer id = null;



/**

*

*/
private String swpName = null;



/**

*

*/
private Integer lowerLimit = null;



/**

*

*/
private Integer upperLimit = null;



/**

*

*/
private String category = null;



/**

*

*/
private String description = null;



/**

* The total number of rows to be read by the JSON reader

*/

private int total = 0;


/**


*

*/
private List superwps = new ArrayList();




/**

* The success or failure property to be read by the JSON reader
*/
private boolean success = true;



/**


* @return
*/

public String getAllSuperPackages() {

System.out.println("getting all super packages");

superwps = SuperWorkPackages.superWorkPackageList;

System.out.println(superwps.size()); // this says the length is 3

setTotal(superwps.size());

setSuccess(true);


return SUCCESS;


}


// setters and getters below
}



my struts.xml



<!-- The package for json related actions -->
<package name="jsondefault" extends="json-default">
<!-- AJAX for all the super work packages -->
<action name="getallswps" class="com.company.project.action.SuperWorkPackageAction"
method="getAllSuperPackages">
<result type="json"></result>
</action>
</package>

vishalnnsingh
7 Sep 2010, 10:28 PM
First of all i can't see nay grid in your .js file.
Secondly I think there is a lot of redundant codes in your js file.

Please replace

var superWPDataStore = new Ext.data.JsonStore( {
storeId: 'super-wps',
baseParams : { type : "json",
searchall : true }, url : "getallswps.action", method : 'POST', reader : jsonReaderSuperWP
});

with this


var superWPDataStore = new Ext.data.Store({
reader: new Ext.data.JsonReader({
//id is the valueField shud match the name in the json , //text is the display field
fields:['id','text'],
root:'rows'
//your returned json shud be like this {rows:[{"id":"1","text":"Delhi"},{"id":"2","text":"Kolkata"}]}
}),
proxy: new Ext.data.HttpProxy({
url: 'getallswps.action'
})

});

and make sure your to replace existing value and displayfoeld config options with this or the names in your json object

displayField:'text',
valueField:'id',

In the meantime please make sure that you are recieving the json with data without any errors to check your json, just copy paste it in jsonlint.com

Vivek_Madapura_V
7 Sep 2010, 10:41 PM
Thanks Vishal,


First of all i can't see nay grid in your .js file.


I meant a form! Sorry.

I just replaced the declaration

JsonStore
with

Store

and removed the



baseParams : {type : "json",

searchall : true
},


as a starting point and it works like charm.
Could you direct me towards the problem. Is it the redundant code?

Condor
7 Sep 2010, 11:37 PM
1. JsonStore doesn't have a 'reader' property. It creates its own JsonReader from the config you specified. Since you specify your own reader, you need a plain Store.

2. The combobox is configured as mode:'remote', so it will load the store when required. Alternatively, you could configure the store with autoLoad:true, but then you would configure the combobox as mode:'local'.

3. Loading is asynchronous. You have to wait for the server to respond before you can query the result (which is why you got 0 from getTotalCount).

Vivek_Madapura_V
7 Sep 2010, 11:43 PM
Thanks Condor.