当前位置: 首页 > 工具软件 > dhtmlxCombo > 使用案例 >

DHTMLX combo的学习

姚晋
2023-12-01

1 combo init
1)普通的Combo init
方法1:

var comboObject1 = {
parent: "combo_zone1",
idth: 200,
items: [{value: "1",text: "one"}, {value: "2",text: "two"}, {value: "3",text: "three"}]

     }
  var combo1 = new dhtmlXCombo(comboObject1);

    方法二:

var z2 = new dhtmlXCombo("combo_zone3", "alfa", 200);

z2.addOption([[1, 1111], [2, 2222], [3, 3333], [4, 4444], [5, 5555]]);


2)带checkbox的Combo

var z= new dhtmlXCombo("combo_zone2", "alfa3", 200,'checkbox');

z.attachEvent("onCheck", function(value, state) {
alert(value + ":" + state);
return true;
});
z.addOption([[1, 1111], [2, 2222], [3, 3333], [4, 4444], [5, 5555]]);


3)XML 加载
var comboObject4 = {
parent: "combo_zone4",
width: 200,
readonly: true,
}
var combo4 = new dhtmlXCombo(comboObject4);
combo4.enableOptionAutoHeight(true,1000);//自适应高度
combo4.loadXML("xml/data.xml");//加载xml


2 combo API的使用

1)Combo 选择框高度自适应 :(需要加载 /codebase/ext/dhtmlxcombo_why.js)

                                 mygrid.enableOptionAutoHeight(true,200);

2)增加选择Option :addOption()

      var combo_wardName = new dhtmlXCombo("combo_wardName", "alfa3", 80);
combo_wardName.addOption(1, "本医院");
combo_wardName.addOption(2, "所有医院");
combo_wardName.setComboText("所有医院");

3)Combow文本内容 :  setComboText("1111")  与 getSelectedText()

4)选择框的弹出与隐藏:openSelect()

5)只读:readonly(true);

3 combo 事件

1)combo选中值修改监听

status_combo.attachEvent ("onSelectionChange", onSelectionChange);


2)键盘输入监听

combo_medname.DOMelem_input.οnkeydοwn=function(ev){ //监听键盘Down事件的监听(向上,向下,Enter)
var event=ev||window.event;
var keyCode=checkBrowser()=="FireFox"?event.which:event.keyCode;
if(keyCode==13){ //回车键监听
combo_list_index=combo_medname.getSelectedIndex();
}else if(keyCode==38){ //向上键监听
combo_list_index=combo_medname.getSelectedIndex();
if(combo_list_index==0){
combo_list_index=combo_medname.optionsArr.length-1;
var old=combo_medname.getComboText();
combo_medname.selectOption(combo_list_index,true,true);
combo_medname.setComboText(old);
}else{
combo_list_index--;
var old=combo_medname.getComboText();
combo_medname.selectOption(combo_list_index,true,true);
combo_medname.setComboText(old);
}
}else if(keyCode==40){ //向下键监听
combo_list_index=combo_medname.getSelectedIndex();
if(combo_list_index==combo_medname.optionsArr.length-1){
combo_list_index=0;
var old=combo_medname.getComboText();
combo_medname.selectOption(combo_list_index,true,true);
combo_medname.setComboText(old);
}else{
combo_list_index++;
var old=combo_medname.getComboText();
combo_medname.selectOption(combo_list_index,true,true);
combo_medname.setComboText(old);
}
}else if(keyCode==8){combo_medname.closeAll(); }
}

combo_medname.DOMelem_input.οnkeyup=function(ev){ //监听键盘UP事件的监听(向上,向下,Enter)
var event=ev||window.event;
var keyCode=checkBrowser()=="FireFox"?event.which:event.keyCode;
if(keyCode==13){
var oldVal = $(this).val();//取得combo上的值
if(oldVal.length<2){ //长度小于2则 结束
return;
}
combo_list_index=combo_medname.getSelectedIndex();
//combo_medname.enableOptionAutoHeight(true);
if(combo_list_index==-1){
combo_medname.clearAll();
$.ajax({
url:"drugmanage/searchMedName.htm",
async: false,
cache: false,
type:"post",
data:"medname="+oldVal+"&time="+new Date(),
error:function(){
alert("加载失败!")
},
success:function(reply){
var ary = reply.split(";");
var medcodes = ary[0].split(",");
var mednames = ary[1].split(",");
var spec = ary[2].split(",");
var mafname = ary[3].split(",");
for(var i=0;i<medcodes.length;i++){
combo_medname.addOption(medcodes[i],mednames[i]+" "+spec[i]+" "+(mafname[i]==null?"":mafname[i]));
}
combo_medname.openSelect();
combo_medname.setComboText(oldVal);
combo_medname.DOMelem_input.select();
}
});
}else{
var tmednode=combo_medname.getSelectedValue();
var tmedname=combo_medname.getSelectedText().split(" ")[0];
combo_medname.setComboText(tmedname);

}
$('#drugName').val(combo_medname.getComboText());

}else if(keyCode==38){
combo_medname.DOMelem_input.select();
}else if(keyCode==40){
combo_medname.DOMelem_input.select();
}else{
combo_medname.unSelectOption();
combo_medname.closeAll();
}
} //onkeyup结束



 类似资料: