【ExtJS实践】之六 ：Combobox从后台获取JSON格式的数据

1、直接看代码：

Ext.BLANK_IMAGE_URL = "extjs/resources/images/default/s.gif";

var storeUnit = new Ext.data.JsonStore({
fields: ['units_code', 'units_name'],
url : "../Cost_JsonDb.ashx?tablename=cost_units",
autoLoad:true,
root : "units"
});

// 单位（计量单位）的下拉列表
var comboUnit = new Ext.form.ComboBox({
store: storeUnit,
displayField:'units_code',
typeAhead: true,
mode: 'local',
forceSelection: true,
triggerAction: 'all',
emptyText:'选择单位...',
selectOnFocus:true
});

Ext.onReady(function(){
comboUnit.render("combo-div");
});

2、在实例化JsonStore时，需要指定的参数有：

fields : 绑定数据的字段

url : 获取后台数据的地址

autoload : 设置为true时，Ext会自动的调用url中指定的地址获取数据；设置为false，则需要执行JsonStore.load()来获取数据

root : 后台返回数据的根节点的名字。Ext中为combobox和grid绑定数据时，后台返回的数据必须有一个根节点，否则不能正确绑定。

3、后台需返回数据格式示例：

{
"units":[
{"units_code":"kg","units_name":"\u5343\u514B"},
{"units_code":"m","units_name":"\u7C73"},
{"units_code":"m2","units_name":"\u5E73\u65B9\u7C73"},
{"units_code":"m3","units_name":"\u7ACB\u65B9\u7C73"},
{"units_code":"t","units_name":"\u5428"}
]
}