Ext2.0 Local mode dynamic Modify ComboBox selection

In many cases, ComboBox's selections have been downloaded to the local, but stored in a different way, we need to dynamically modify the ComboBox selection. For example, there is a tree, the node of the tree is the ComboBox option, in Ext2.0 the tree's storage format is not using the store, and ComboBox must use the store, which requires data conversion. This article takes this as an example to study how to dynamically modify the ComboBox selection.

Let's first create a tree with several options:

var root = new Ext.tree.TreeNode({
　　 text: '选项',
　　 allowDrag:false,
　　 allowDrop:false
　　 });
　　 root.appendChild(
　　 new Ext.tree.TreeNode({id:1,text:'选项一',allowDrag:false}),
　　 new Ext.tree.TreeNode({id:2,text:'选项二',allowDrag:false}),
　　 new Ext.tree.TreeNode({id:3,text:'选项三',allowDrag:false}),
　　 new Ext.tree.TreeNode({id:4,text:'选项四',allowDrag:false})
　　 );
　　 var tree=new Ext.tree.TreePanel({
　　 style:'margin:20px 0 0 20px',
　　 title:'选项列表',
　　 width: 200,
　　 height:300,
　　 root:root
　　 })
　　 tree.render(document.body);
　　 root.expand();

The code first created a tree node root, which will be the root of the tree, and then add the ID 1, 2, 3, 4 of the child nodes, which is the ComboBox selection of 4 child nodes, ID is the ComboBox of the submission value, text is the display value.

The following creates a ComboBox:

var combo=new Ext.form.ComboBox({
　　 　 valueField :"id",
　　 　displayField: "text",
　　 　 store:new Ext.data.SimpleStore({
　　 fields: ["id", "text"],
　　 data: []
　　 }),
　　 　 mode: 'local',
　　 　blankText:'请选择',
　　 　 emptyText:'请选择',
　　 　 hiddenName:'testhide',
　　 　fieldLabel: '测试',
　　 　 name: 'test',
　　 　 anchor:'90%'
　　 })