Extjs (自作)_extjs の ComboBoxTree によって実装されたドロップダウン ボックス ツリー効果

Ext.ux.TreeCombo = Ext.extend(Ext.form.ComboBox, {
constructor: function (cfg) {
cfg = cfg ||
Ext.ux.TreeCombo.superclass.constructor.call({
maxHeight: 300,
editable: false,
mode : 'local'、
triggerAction: 'all'、
rootVisible: false、
selectMode: 'all'
}、
}、
store: new Ext .data.SimpleStore({
fields: [],
data: [[]]
}),
// ツリー ノードを展開してもドロップダウン ボックスが閉じないように onViewClick を書き換えます
onViewClick: function (doFocus) {
varindex = this .view.getSelectedIndexes()[0], s = this.store, r = s.getAt(index);
if (r);
this.onSelect(r,index);
}
if (doFocus !== false) {
this.el.focus()
}
}; >tree: null,
// 隠し値
hiddenValue: null,
getHiddenValue: function () {
return this.hiddenValue
},
getValue: function () { //元のコンボコンポーネントと同様に適用性を高めます。
return this.
},
setHiddenValue: function (code, dispText) {
this.setValue(code); .form.ComboBox.superclass.setValue.call(this, dispText);
this.hiddenValue = code;
},
initComponent: function () {
var _this = this; var tplRandomId = 'deptcombo_' Math.floor(Math.random() * 1000 ) this.tplId
this.tpl = ""
this.tree = new Ext.tree.TreePanel({
border: false,
enableDD: false,
enableDrag: false,
rootVisible: _this.rootVisible || false、
autoScroll: true、
trackMouseOver: true、
height: _this.maxHeight、
lines: true、
singleExpand: true、
root: new Ext.tree.AsyncTreeNode({
id: _this.rootId,
text: _this.rootText,
iconCls: 'ico-root',
expanded: true,
leaf: false,
border: false、
draggable: false、
singleClickExpand: false、
hide: true
})、
loader: new Ext.tree.TreeLoader({
nodeParameter : 'ID',
requestMethod: 'GET',
dataUrl: _this.url
})
});
this.tree.on('click', function (node) {
if ((_this.selectMode == 'leaf' && ノード .leaf == true) || _this.selectMode == 'all') {
if (_this.fireEvent('beforeselect', _this,ノード)) {
_this.fireEvent('select', _this, ノード);
}
}
}); ) {
var dispText = node.text;
obj.setHiddenValue(code, dispText);
this.on('expand', function () {
this.tree.render(tplRandomId);
});
Ext.ux.TreeCombo.superclass.initComponent.call(this);
}
})
Ext.reg("treecombo", Ext.ux.TreeCombo);


その後、Extjs クラス ライブラリ

を追加します。


コードをコピーします

このうち、login.js のコードは次のとおりです:




コードをコピー

/* ファイル作成日: 2013 年 5 月 27 日 */
Ext.onReady(function () {
var _window = new Ext.Window({
title: "クエリ条件" ,
renderTo: Ext.getBody()、
frame: true、
plain: true、
buttonAlign: "center"、
closeAction: "hide"、
maximizable: true 、
closeable: true、
bodyStyle: "padding:20px"、
width: 350、
height: 300、
layout: "form"、
lableWidth: 110、
デフォルト: { xtype: "textfield", width: 180 },
items: [
{
fieldLabel: "Case Number",
anchor: "100%"
},
{
xtype: "datefield",
fieldLabel: "事件発生時刻",
anchor: "100%"
},
{
fieldLabel: "reporter ",
アンカー: "100%"
},
{
フィールドラベル: "報告された単位または個人",
アンカー: "100%"
},
{
xtype: "treecombo",
fieldLabel: "事件が発生した場所",
anchor: "100%",
url: "http://localhost:1502/treeData.ashx"/ //
},
{
xtype: "treecombo",
fieldLabel: "case type",
anchor : " 100%",
url: "http://localhost:1502/window/ajwflx.ashx"
},
{
xtype: "treecombo",
fieldLabel: " の性質このケース"、
アンカー: "100%"、
url: "http://localhost:1502/window/ajwfxz.ashx"
}
]、
ボタン: [{テキスト: "OK" }, { テキスト: "キャンセル", ハンドラー: function () { _window.hide(); } }]
})
_window.show()
})

string strTreeNode = "["
"{'id':150100,'leaf':false,expanded:false,'text':'フフホト土地資源局','children':[ "
"{'id':150101,'leaf':true,'children':null,'text':'市土地資源局'},"
"{'id':150102, 'leaf':true,'children':null,'text':'新城区土地資源局'},"
"{'id':150103,'leaf':true,'children':null, 'text ':'恵民区土地資源局'},"
"{'id':150104,'leaf':true,'children':null,'text':'玉泉区土地資源局' },"
"{'id':150105,'leaf':true,'children':null,'text':'西漢区土地資源局'},"
"{'id': 150121,'leaf ':true,'children':null,'text':'トゥームット左バナー土地資源局'},"
"{'id':150122,'leaf':true,'children' :null, 'text':'トケトゥオ郡土地資源局'},"
"{'id':150123,'leaf':true,'children':null,'text':'ヘリンガー郡土地資源局'},"
"{'id':150124,'leaf':true,'children':null,'text':'清水河県土地資源局'},"
"{' id ':150125,'leaf':true,'children':null,'text':'武川県土地資源局'}"
"]},"
"{'id':150200,' Leaf':false,expanded:false,'text':'包頭市土地資源局','children':["
"{'id':150201,'leaf':true,'children':null , 'text':'市区土地資源局'},"
"{'id':150202,'leaf':true,'children':null,'text':'東河区土地資源局'} ,"
"{'id':150203,'leaf':true,'children':null,'text':'クンドゥルン地区土地資源局'},"
"{'id' : 150204,'leaf':true,'children':null,'text':'青山区土地資源局'},"
"{'id':150205,'leaf':true,'children' :null ,'text':'シグアイ地区土地資源局'},"
"{'id':150206,'leaf':true,'children':null,'text':'白雲鉱区土地資源局' },"
"{'id':150207,'leaf':true,'children':null,'text':'九園区土地資源局'},"
"{ 'id': 150221,'leaf':true,'children':null,'text':'トゥームット右バナー土地資源局'},"
"{'id':150222,'leaf':true ,'children ':null,'text':'古陽県土地資源局'},"
"{'id':150223,'leaf':true,'children':null,'text':'ダルハン茂名安聯連合バナー土地資源局'}"
"]},"
"{'id':150300,'leaf':false,expanded:false,'text':'烏海市の土地と資源局' ,'children':["
"{'id':150301,'leaf':true,'children':null,'text':'地方土地資源局'},"
"{' id':150302,'leaf':true,'children':null,'text':'海波湾地区土地資源局'},"
"{'id':150303,'leaf ':true, 'children':null,'text':'海南地方土地資源局'},"
"{'id':150304,'leaf':true,'children':null,'text ':'五達区土地資源局'}"
"]},"
"{'id':150400,'leaf':false,expanded:false,'text':'赤峰市の土地と資源局','children ':["
"{'id':150401,'leaf':true,'children':null,'text':'地方土地資源局'},"
"{'id': 150402,'leaf':true,'children':null,'text':'紅山区土地資源局'},"
"{'id':150403,'leaf' :true,'children':null ,'text':'元宝山区土地資源局'},"
"{'id':150404,'leaf':true,'children':null,'text' :'松山区土地資源局'} ,"
"{'id':150421,'leaf':true,'children':null,'text':'アルホルチンバナー土地資源局'},"
"{'id': 150422,'leaf':true,'children':null,'text':'バーレーン左翼バナー土地資源局'},"
"{'id':150423, 'leaf':true,'children': null,'text':'バーレーン右旗土地資源局'},"
"{'id':150424,'leaf':true,'children':null ,'text':'臨西県土地資源局'},"
"{'id':150425,'leaf':true,'children':null,'text':'ケシケテン バナー土地資源局'},"
"{ 'id':150426,'leaf':true,'children':null,'text':'ウェンニット・バナー土地資源局'},"
"{'id' :150428,'leaf':true ,'children':null,'text':'ハラチンバナー土地資源局'},"
"{'id':150429,'leaf':true,'children' :null,'text': '寧城県土地資源局'},"
"{'id':150430,'leaf':true,'children':null,'text':'アオハンバナーランドと資源局'}"
"]},"
"{'id':150500,'leaf':false,expanded:false,'text':'通寮市土地資源局','children ':["
"{ 'id':150501,'leaf':true,'children':null,'text':'市土地資源局'},"
"{'id' :150502,'leaf':true,'children':null,'text':'Horqin District Land and Resource Bureau'},"
"{'id':150521,'leaf':true,'children' :null,'text':'ホーチン左翼センターバナー土地資源局'},"
"{'id':150522,'leaf':true,'children':null,'text':'ホーチン左翼侯バナー土地資源局'},"
"{'id':150523,'leaf':true,'children':null,'text':'開鹿県土地資源局'}, "
"{'id':150524,'leaf': true,'children':null,'text':'Kulun バナー土地資源局'},"
"{'id':150525, 'leaf':true,'children':null,'text':' ナイマン バナー土地資源局'},"
"{'id':150526,'leaf':true,'children':null, 'text':'Zalut バナー土地資源局'},"
" {'id':150581,'leaf':true,'children':null,'text':'ホリンゴル市土地資源局' }"
"]},"
"{'id ':150600,'leaf':false,expanded:false,'text':'オルドス土地資源局','children':["
"{'id':150602,'leaf':true,'children':null,'text':'東勝区土地資源局'},"
"{'id':150621,'leaf ':true,'children':null,'text':'ダラ特別バナー土地資源局'},"
"{'id':150622,'leaf':true,'children':null,' text':'Zhungar バナー土地資源局'},"
"{'id':150623,'leaf':true,'children':null,'text':'オトク銭バナー土地資源局'},"
"{'id' : 150624,'leaf':true,'children':null,'text':'オトゥオケ バナー土地資源局'},"
"{'id':150625,'leaf':true,'children ': null,'text':'杭津バナー土地資源局'},"
"{'id':150626,'leaf':true,'children':null,'text':'呉神バナー土地資源局'},"
"{'id':150627,'leaf':true,'children':null,'text':'エジンホロ バナー土地資源局'}"
"] },"
"{'id':150700,'leaf':false,expanded:false,'text':'フルンボイル市土地資源局','子供':["
"{'id' :150701, 'leaf':true,'children':null,'text':'市土地資源局'},"
"{'id':150702,'leaf':true,'children': null, 'text':'海拉尔区土地資源局'},"
"{'id':150721,'leaf':true,'children':null,'text':'アロングバナー土地資源局' } ,"
"{'id':150722,'leaf':true,'children':null,'text':'モリダワ・ダウル自治旗土地資源局'},"
"{ 'id ':150723,'leaf':true,'children':null,'text':'オロチョン自治バナー土地資源局'},"
"{'id':150724,'leaf':true, ' Children':null,'text':'エウェンキ自治バナー土地資源局'},"
"{'id':150725,'leaf':true,'children':null,'text':' チェンBarhu バナー土地資源局'},"
"{'id':150726,'leaf':true,'children':null,'text':'新しい Barhu 左バナー土地資源局'}, "
"{'id':150727,'leaf':true,'children':null,'text':'新バーフ右バナー土地資源局'},"
"{'id': 150781 ,'leaf':true,'children':null,'text':'満州里土地資源局'},"
"{'id':150782,'leaf':true,'children':null , 'text':'焼市市土地資源局'},"
"{'id':150783,'leaf':true,'children':null,'text':'ジャラントゥン市土地資源局'},"
"{'id':150784,'leaf':true,'children':null,'text':'エルグン市土地資源局'},"
" {'id' :150785,'leaf':true,'children':null,'text':'元河市土地資源局'}"
"]},"
"{'id': 150800,'leaf ':false,expanded:false,'text':'バヤンヌール市土地資源局','children':["
"{'id':150801,'leaf':true,'children':null, 'text':'市区土地資源局'},"
"{'id':150802,'leaf':true,'children':null,'text':'臨河区土地資源局'},"
"{'id':150821,'leaf':true,'children':null,'text':'婺源県土地資源局'},"
"{' id' :150822,'leaf':true,'children':null,'text':'登口県土地資源局'},"
"{'id':150823,'leaf':true,'children' :null,'text':'ウラド正面バナー土地資源局'},"
"{'id':150824,'leaf':true,'children':null,'text':'ウラド・テゾン・バナー土地資源局'},"
"{'id':150825,'leaf':true,'children':null,'text':'ウラドウバナー土地資源局'},"
" {'id':150826,'leaf':true,'children':null,'text':'杭津後旗土地資源局'}"
"]},"
"{'id' :150900 ,'leaf':false,expanded:false,'text':'ウランカブ市土地資源局','children':["
"{'id':150901,'leaf':true ,'children' :null,'text':'市区土地資源局'},"
"{'id':150902,'leaf':true,'children':null,'text':'寧区の土地を設定および資源局'},"
"{'id':150921,'leaf':true,'children':null,'text':'卓子県土地資源局'},"
"{ 'id':150922,'leaf':true,'children':null,'text':'華徳県土地資源局'},"
"{'id':150923,'leaf': true, 'children':null,'text':'上都県土地資源局'},"
"{'id':150924,'leaf':true,'children':null,'text':' Xinghe県土地資源局'},"
"{'id':150925,'leaf':true,'children':null,'text':'梁城県土地資源局'},"
"{'id':150926,'leaf':true,'children':null,'text':'チャハル州右フロントバナー土地資源局'},"
"{'id':150927, 'leaf ':true,'children':null,'text':'チャハル右中央バナー土地資源局'},"
"{'id':150928,'leaf':true,'children' :null, 'text':'チャハル州右裏バナー土地資源局'},"
"{'id':150929,'leaf':true,'children':null,'text':'西子王土地資源局バナーとリソース'},"
"{'id':150981,'leaf':true,'children':null,'text':'豊鎮市土地資源局'}"
"]} ,"
"{'id':152200,'leaf':false,expanded:false,'text':'興安連盟土地資源局','children':["
"{' id': 152201,'leaf':true,'children':null,'text':'ウランホト土地資源局'},"
"{'id':152202,'leaf':true,'children ':null ,'text':'阿爾山市土地資源局'},"
"{'id':152221,'leaf':true,'children':null,'text':'ホルチン右前バナー土地資源局'},"
"{'id':152222,'leaf':true,'children':null,'text':'ホルチン右翼中バナー土地資源局'},"
"{' id':152223,'leaf':true,'children':null,'text':'Zhalaite Banner Land and Resource Bureau'},"
"{'id':152224,' Leaf':true, 'children':null,'text':'拓泉県土地資源局'}"
"]},"
"{'id':152500,'leaf':false, Expanded:false,' text':'シリンゴル連盟土地資源局','children':["
"{'id':152501,'leaf':true,'children':null,'text': 'エレンホト市土地資源局 '},"
"{'id':152502,'leaf':true,'children':null,'text':'シリンホト市土地資源局'},"
"{'id': 152522,'leaf':true,'children':null,'text':'アバガ バナー土地資源局'},"
"{'id':152523,'leaf ':true,'children' :null,'text':'Sunit Left Banner Land and Resource Bureau'},"
"{'id':152524,'leaf':true,'children':null,'text':'Sunit Right Banner Land and Resources Bureau'},"
"{'id' :152525,'leaf':true,'children':null,'text':'East Ujimqin Banner Land and Resources Bureau'},"
"{'id':152526,'leaf':true, 'children':null,'text':'West Ujimqin Banner Land and Resources Bureau'},"
"{'id':152527,'leaf':true,'children':null,'text' :'Taipusi Banner Land and Resources Bureau'},"
"{'id':152528,'leaf':true,'children':null,'text':'Xianhuang Banner Land and Resources Bureau'},"
"{'id':152529,'leaf':true,'children':null,'text':'Zhengxiangbaiqi Land and Resources Bureau'},"
"{'id':152530,'leaf': true,'children':null,'text':'Zhenglan Banner Land and Resources Bureau'},"
"{'id':152531,'leaf':true,'children':null,'text': 'Duolun County Land and Resources Bureau'}"
"]},"
"{'id':152900,'leaf':false,expanded:false,'text':'Alxa League Bureau of Land and Resources ','children':["
"{'id':152921,'leaf':true,'children':null,'text':'Alxa Left Banner Land and Resources Bureau'},"
"{'id':152922,'leaf':true,'children':null,'text':'Alxa Right Banner Bureau of Land and Resources'},"
"{'id':152923,'leaf' :true,'children':null,'text':'Ejina Banner Land and Resources Bureau'}"
"]}"
"]";
context.Response.Write(strTreeNode);