首页 > 程序开发 > web前端 > JavaScript >

combox带treepanel的例子

2011-08-19

new Ext.form.ComboBox({id: &#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;,name: &#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;,value : &#39;<%=keyWord%>&#39;,store: new Ext.da...

new Ext.form.ComboBox({
id: &#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;,
name: &#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;,
value : &#39;<%=keyWord%>&#39;,
store: new Ext.data.SimpleStore({fields:[],data:[[]]}),
tpl: "<tpl for=&#39;.&#39;><div style=&#39;height:200px&#39;><div id=&#39;dbSearch_renderToDiv<%=randomId%>&#39;></div></div></tpl>",
fieldLabel: &#39;"+fieldTitle+"&#39;,
clearCls: &#39;stopFloat&#39;,
emptyText:&#39;请选择或输入检索词...&#39;,
mode: &#39;local&#39;,
triggerAction: &#39;all&#39;,
width: 180,
maxHeight: 200,
selectedClass: &#39;&#39;,
onSelect: Ext.emptyFn,
maxLength : 27,
minLength : 1,
enableKeyEvents : true,
listeners: {
&#39;expand&#39;:function(combo){//把&#39;expand&#39;改成&#39;select&#39;应该就是选择的时候触发吧
var Classification_tree = new Ext.tree.TreePanel({
border: false,
id: &#39;graphSearch__tree&#39;,
root:new Ext.tree.AsyncTreeNode({
text: &#39;关键词维护&#39;,
id:&#39;1&#39;
}),
loader: new Ext.tree.TreeLoader({
dataUrl:&#39;treeUtil.html?content.method=getAntistopTreeNodes&#39;
}),
listeners: {
click : function (node){
var flag = node.attributes.leaf;
if(flag){
Ext.getCmp(&#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;).setValue(node.attributes.essAntistopName);
Ext.getCmp(&#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;).collapse() ;
}
}
}
});
Classification_tree.render(&#39;dbSearch_renderToDiv<%=randomId%>&#39;) ;
Classification_tree.root.reload();
Classification_tree.root.expand() ;
}
,&#39;blur&#39; : function() {this.value=this.el.dom.value; }
,&#39;collapse&#39; : function() {Ext.getCmp(&#39;graphSearch__tree&#39;).destroy() ; }
,&#39;keydown&#39; : function(t, event) {
if (event.keyCode == 13) {
if(Ext.getCmp(&#39;<%=searchType%>_keyWordSearch_searchKeyWord&#39;).isValid()){
searchButton(Ext.getCmp(&#39;<%=searchType%>_mainSearchPanel&#39;),true);//去搜索数据
}else{
Ext.Msg.alert(&#39;提示信息:&#39;,&#39;搜索框不能包含英文单引号、双引号和反斜杠!&#39;);
}
}
}
}

})

-----------另外一种,也是很好的例子用ComboBox和TreePanel实现下拉树------------------------------------------------------------------------------------------
// huying add 20100118 用ComboBox和TreePanel实现下拉树
buffer.append("var parentMenu = new Ext.form.ComboBox({") ;
buffer.append(" id: &#39;parentMenu&#39;,") ;
buffer.append(" store: new Ext.data.SimpleStore({fields:[],data:[[]]}),") ;
buffer.append(" editable: false,") ;
buffer.append(" tpl: \"<tpl for=&#39;.&#39;><div style=&#39;height:200px&#39;><div id=&#39;TreeTpl" + randomId + "&#39;></div></div></tpl>\",") ;
buffer.append(" fieldLabel: &#39;" + PkgTagUtils.message(pageContext, "BusinessForm.fieldLabel.parentMenu") + "&#39;,") ;
buffer.append(" clearCls: &#39;stopFloat&#39;,") ;
buffer.append(" allowBlank: false,") ;
buffer.append(" mode: &#39;local&#39;,") ;
buffer.append(" triggerAction: &#39;all&#39;,") ;
buffer.append(" width: 300,") ;
buffer.append(" maxHeight: 200,") ;
if(business != null && !"".equals(business.getMenus())){
buffer.append(" value: &#39;" + parentNode[1] + "&#39;,") ;
}
buffer.append(" selectedClass: &#39;&#39;,") ;
buffer.append(" onSelect: Ext.emptyFn") ;
buffer.append(" }) ;") ;

buffer.append("var menuHidden = new Ext.form.Hidden({name: &#39;parentMenuId&#39;,") ;
if(business != null && !"".equals(business.getMenus())){
buffer.append(" value: &#39;" + parentNode[0] + "&#39;") ;
} else {
buffer.append(" value: &#39;&#39;") ;
}
buffer.append(" }) ;") ;

buffer.append("var menuTree = new Ext.tree.TreePanel({") ;
buffer.append(" loader: new Ext.tree.TreeLoader({\r\n");
buffer.append(" dataUrl:&#39;treeUtil.html?content.method=getMenuTreeNodes&#39;\r\n");
buffer.append(" }),\r\n");
buffer.append(" border: false,") ;
buffer.append(" root: new Ext.tree.AsyncTreeNode({text: &#39;系统菜单&#39;,id:&#39;1&#39;}) }) ;") ;

buffer.append(" menuTree.on(&#39;click&#39;,") ;
buffer.append(" function(node){") ;
buffer.append(" menuHidden.setValue(node.id) ; ") ;
buffer.append(" parentMenu.setValue(node.text) ;") ;
buffer.append(" parentMenu.collapse() ;") ;
buffer.append(" }) ;") ;

buffer.append(" parentMenu.on(&#39;expand&#39;,function(combo){menuTree.render(&#39;TreeTpl" + randomId + "&#39;) ;menuTree.root.reload(); menuTree.root.expand() ;}) ;") ;

相关文章
最新文章
热点推荐