PDA

View Full Version : static json string display as combo list.



nityajs
6 Aug 2009, 10:04 AM
Hi All,

I am trying to display a static json string values as combo box list but its not working. Here is my code. Please tell me if anything wrong here. I have to display only static string in json format.

//Static string in json format
var newdata= "[{value:'W',meaning:'Weekly'},{value:'BW',meaning:'Bi-Weekly'},{value:'M',meaning:'Monthly'}]";

//combo box object
var comboTest = new Ext.form.ComboBox({
id:'combofreq', typeAhead: true, triggerAction: 'all',
lazyRender:true,

store: new Ext.data.JsonStore({
id: 0, root:newdata,
fields: [
{name:'value', mapping:'value'},
{name:'meaning', mapping:'meaning'},
],
}),
valueField: 'value',
displayField: 'meaning',
fieldLabel :'Test Json Combo',
name :'jsoncombotest',
anchor :'95%'
});

This combo I am using as an item in the form panel to display. Combo is displayed but the values are not displayed. Please help.

steffenk
6 Aug 2009, 10:14 AM
Hi,

please use code boxes next time.

You forgot something:


var comboTest = new Ext.form.ComboBox({
id:'combofreq',
typeAhead: true,
triggerAction: 'all',
lazyRender:true,
mode: 'local',

store: new Ext.data.JsonStore({
storeId: 'myComboStore',
fields: [
{name:'value', mapping:'value'},
{name:'meaning', mapping:'meaning'},
],
data: newdata
}),
valueField: 'value',
displayField: 'meaning',
fieldLabel :'Test Json Combo',
name :'jsoncombotest',
anchor :'95%'
});

nityajs
6 Aug 2009, 10:25 AM
Its still not working this way :(

steffenk
6 Aug 2009, 10:27 AM
do you have a renderTo ?


renderTo: 'combotest'

and in html:

<div id="combotest"></div>

nityajs
6 Aug 2009, 10:37 AM
I am using this combo object as of the items in Form Panel. I can see the combo box but when clicked empty list is displayed.

steffenk
6 Aug 2009, 11:15 AM
then the reason is somewhere else. Check out the complete html:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>New</title>
<link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css"/>
<script type="text/javascript" src="../adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="../ext-all-debug.js"></script>

<style>
body {padding: 30px;}
h1,h2,h3 {margin:15px 0 10px;}
</style>

<script>

// reference local blank image
Ext.BLANK_IMAGE_URL = '../resources/images/default/s.gif';

Ext.ns('TEST');


// create application
TEST.staticjson = function() {

// private space


return {

// public methods
init: function() {

//Static string in json format
var newdata= [{value:'W',meaning:'Weekly'},{value:'BW',meaning:'Bi-Weekly'},{value:'M',meaning:'Monthly'}];

//combo box object
var comboTest = new Ext.form.ComboBox({
id:'combofreq',
typeAhead: true,
triggerAction: 'all',
lazyRender:true,
mode: 'local',

store: new Ext.data.JsonStore({
storeId: 'myComboStore',
fields: [
{name:'value', mapping:'value'},
{name:'meaning', mapping:'meaning'},
],
data: newdata
}),
valueField: 'value',
displayField: 'meaning',
fieldLabel :'Test Json Combo',
name :'jsoncombotest',
anchor :'95%',
renderTo: 'combotest'
});

}

};
}(); // end of app


Ext.onReady(TEST.staticjson.init, TEST.staticjson);
</script>

</head>
<body>
<div id="combotest"></div>
</body>
</html>

Condor
6 Aug 2009, 11:25 AM
Why is your data defined as a string and not as a JSON object?

I you keep it as a string you will first need to decode it:


data: Ext.decode(newdata)

steffenk
6 Aug 2009, 11:35 AM
ah, that i missed to say, i removed the surrounding ""

nityajs
6 Aug 2009, 4:24 PM
Thanks a lot!!! It worked now...=D>