PDA

View Full Version : loading Ext.form.ComboBox displayField and valueField by Ext.form.FormPanel load



ali.bakan
21 Apr 2010, 5:09 AM
hi all;

i am trying to load comboboxes with basicform load method. but this operation sets only valueFields of comboboxes. i know loading combobox's store is a solution but i have few comboxes and i don't want to load all comboboxes' stores.

i can set manually with setRawValue method after form loading. but this is not a good solution i think. is there any simple and good solution.
any advices?

thanks

onur.ozgur.ozkan
21 Apr 2010, 6:11 AM
I have the same problem. Could we overwrite .load method value / display fields for comboboxes?

ali.bakan
29 Apr 2010, 6:00 AM
i figured out something. but i don't think it is the best solution.


<html>
<head>
<title>Getting Started Example</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />

<script src="ext/adapter/ext/ext-base.js" ></script>
<script src="ext/ext-all-debug.js"></script>
<script src="ext/override.js"></script>

<script>

function f() {
var values = new Ext.data.Store({
reader: new Ext.data.JsonReader({
fields: ['id', 'name'],
root: 'rows'
}),
proxy: new Ext.data.HttpProxy({
url: 'test.json'
}),
autoLoad: false
});

var myForm = new Ext.FormPanel({
url: 'my.php',
renderTo: 'myarea',
frame: true,
title: 'Title',
width: 550,
items: [
{
xtype: 'textfield',
name: 'myedit',
width: 130,
fieldLabel: 'Edit'
},
{
xtype: 'combo',
name: 'mycombo',
fieldLabel: 'Combo',
mode: 'remote',
store: values,
triggerAction : 'all',
displayField:'name',
valueField: 'id',
width: 130
}
],
buttons: [
{
text: 'Load',
handler: function () {
myForm.getForm().load();
}
},
{
text: 'Get Combo Value',
handler: function () {
alert(myForm.getForm().findField('mycombo').getValue());
}
}]
});
};

Ext.onReady(f);
</script>

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

here is override.js

Ext.override(Ext.form.BasicForm, {
setValues : function(values) {
if(Ext.isArray(values)){ // array of objects
for(var i = 0, len = values.length; i < len; i++){
var v = values[i];
var f = this.findField(v.id);
if(f){
f.setValue(v.value);
if(this.trackResetOnLoad){
f.originalValue = f.getValue();
}
}
}
}else{ // object hash
var field, id;
for(id in values){
if(!Ext.isFunction(values[id]) && (field = this.findField(id))){
field.setValue(values[id]);
///////////
if (field.getXType() == 'combo') {
field.setRawValue(values[id + 'Raw']);
}
///////////
if(this.trackResetOnLoad){
field.originalValue = field.getValue();
}
}
}
}
return this;
}
});

and my test.json includes

{
"rows":[
{"id": "1" , "name": "Small"},
{"id": "2" , "name": "Medium"},
{"id": "3" , "name": "Large"}
]
}

my.php file includes

{success: true, data: {myedit: 'hede', mycombo: 2, mycomboRaw: 'Medium'}}

best regards...