对下拉可选框的总结

最近的项目里用了自己做的下拉可选矿

 中间有部分是级联查询的 代码还有优化的空间 只是将代码摘抄出来 未来得及整理

//获得对象的位置信息function getInfo(o){   var to=new Object();   to.left=to.right=to.top=to.bottom=0;    var twidth=o.offsetWidth;   var theight=o.offsetHeight;   while(o!=document.body){     to.left+=o.offsetLeft;     to.top+=o.offsetTop;     o=o.offsetParent;   }     to.right=to.left+twidth;     to.bottom=to.top+theight;   return to;}//隐藏筛选function cancelShaixuan(){//$("shaixuan").style.display="none";hideAllShaixuan();}//列表转换成树可用jsofunction changeListToTreejso(list,args){var arr=new Array();arr[0] = {LEVEL : 1,CHECKED : 0,PARENT : -1,ID : 1,NAME : "全选",NUM : 0}if((typeof (list))=='undefined'){alert(args[0]);}for(var i=0;i<list.length;i++){arr[i+1]={};arr[i+1].LEVEL=1;arr[i+1].CHECKED=0;arr[i+1].PARENT=1;arr[i+1].ID=list[i][args[0]];arr[i+1].NAME=list[i][args[1]];arr[i+1].NUM=i+1;}return arr;}//对象转换成树可用jsofunction changeObjToTreejso(obj, args) {var arr = new Array();/*for (var i = 1; i > 0; i++) {if (obj[i]) {var t = {};t.LEVEL =1;t.CHECKED = 0;t.PARENT = 1;t.ID = obj[i];t.NAME = obj[i];t.NUM = i;arr[i - 1] = t;} else {break;}}*/arr[0] = {LEVEL : 1,CHECKED : 0,PARENT : -1,ID : 1,NAME : "全选",NUM : 0}var i=1;for(var o in obj){if(obj[o]=="--请选择--")continue;var t = {};t.LEVEL =1;t.CHECKED = 0;t.PARENT = 1;t.ID =obj[o];t.NAME = obj[o];t.NUM = i;arr[i ] = t;i++;}return arr;}//显示权限树function showTree(cdfString) {document.getElementById("TreeDiv").style.display = "block";if (treeObj != null) {document.getElementById("TreeDiv").innerHTML = "";//_changeTreeItemChecked(cdfString, treeObj, "_tree");//treeObj = _showMultiCheckTree(cdfString, "TreeDiv", "_tree");} else {//treeObj = _showMultiCheckTree(cdfString, "TreeDiv", "_tree");}treeObj = _showMultiCheckTree(cdfString, "TreeDiv", "_tree");// lm.hide();}//开始筛选function makeShaixuan(){hideAllShaixuan();/*var permisionStr =treeObj[currentType].getAllChecked();if(permisionStr!=null && permisionStr!='')permisionStr=permisionStr.replace("1,","");if(permisionStr=="1"){permisionStr="";}*/// 控制按钮setButton();var searchJSO = changeFormToJSO($("projectsearch"));userSearchName = searchJSO.SITENAME1;//searchCon = searchJSO;searchJSO.SITENAME = searchJSO.SITENAME1;for(var i=0;i<shaixuan_ids.length;i++){try{searchJSO[shaixuan_ids[i]]=treeObj[shaixuan_ids[i]].getAllChecked();}catch(e){alert(treeObj["BRANCH_IDS"].getAllChecked());alert("获得查询条件时候报错"+shaixuan_ids[i]);}}/*if(currentType=="业务区"){searchJSO.BRANCH_IDS=permisionStr;selected_branch_ids=permisionStr;}else//searchJSO.BRANCH_IDS="";if(currentType=="站点建设状态"){searchJSO.JSSTATES=permisionStr;}else//searchJSO.JSSTATES="";if(currentType=="工程阶段"){searchJSO.GC_PHASES=permisionStr;}else//searchJSO.GC_PHASES="";if(currentType=="项目名称"){searchJSO.PROJECT_NAMES=permisionStr;}else//searchJSO.PROJECT_NAMES="";if(currentType=="铁塔设计文本"){searchJSO.IS_UPLOAD_NAMES=permisionStr;}else//searchJSO.IS_UPLOAD_NAMES="";if(currentType=="项目编号"){searchJSO.PROJECT_CODES=permisionStr;}else//searchJSO.PROJECT_CODES="";if(currentType=="县市"){searchJSO.COUNTRY_NAMES=permisionStr;}//else //searchJSO.COUNTRY_NAMES="";*/searchCon = searchJSO;mygrid.setSearchPar(searchJSO);mygrid.beginPageLoad();if (winSearch != null) {winSearch.hide();}//document.getElementsByName("allItem")[1].checked = false;//permisionStr += "," + permisionTreeObj.getAllPartiallyChecked();//$("shaixuan").style.display="none";}//初始筛选的数据结构function initShaixuan(){//alert("初始化筛选");BoWxPlanSiteService.getColumnRecords({'COLUMNNAME':'PROJECT_NAME,PROJECT_CODE,IS_UPLOAD_NAME,GC_PHASE,COUNTRY_NAME'},function(jso){treeData.PROJECT_NAME=jso.PROJECT_NAME;treeData.PROJECT_CODE=jso.PROJECT_CODE;treeData.IS_UPLOAD_NAME=jso.IS_UPLOAD_NAME;treeData.GC_PHASE=jso.GC_PHASE;treeData.COUNTRY_NAME=jso.COUNTRY_NAME;//treeData={}; treeObj={};// treeData = {};var id =shaixuan_ids[0];createShaixuanDiv(id); treeData[id]=changeListToTreejso( treeData.ywq ,args);treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id); id =shaixuan_ids[1];createShaixuanDiv(id); treeData[id]=changeListToTreejso(treeData.COUNTRY_NAME,["COUNTRY_NAME","COUNTRY_NAME"]); treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);  id =shaixuan_ids[2];createShaixuanDiv(id);treeData[id]=changeObjToTreejso(JSSTATE_ALL,["JSSTATE","JSSTATE"]);treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id); id =shaixuan_ids[3]; createShaixuanDiv(id); treeData[id]=changeListToTreejso(treeData.GC_PHASE,["GC_PHASE","GC_PHASE"]); treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);id =shaixuan_ids[4];createShaixuanDiv(id); //treeData["铁塔设计文本"]=changeListToTreejso(treeData.GC_PHASE,["GC_PHASE","GC_PHASE"]);/*var data = [{"IS_UPLOAD_NAME":"已设计"},{"IS_UPLOAD_NAME":"未设计"}];alert(data[0].IS_UPLOAD_NAME);*/ treeData[id]=changeListToTreejso([{"IS_UPLOAD_NAME":"已上传"},{"IS_UPLOAD_NAME":"未上传"}],["IS_UPLOAD_NAME","IS_UPLOAD_NAME"]); treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);  id =shaixuan_ids[5]; createShaixuanDiv(id);   treeData[id]=changeListToTreejso(treeData.PROJECT_NAME,["PROJECT_NAME","PROJECT_NAME"]);   treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);    id =shaixuan_ids[6]; createShaixuanDiv(id); treeData[id]=changeListToTreejso(treeData.PROJECT_CODE,["PROJECT_CODE","PROJECT_CODE"]); treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);  pagemask.hide(); });}//展示筛选框function showShaiXuan(type){;event.cancelBubble=true; hideAllShaixuan(); if(type=="县市"){ var selected_branch_ids= treeObj["BRANCH_IDS"].getAllChecked(); if(selected_branch_ids!=""){  }else{ _alert("请先选择业务区!"); return; }var searchJSO = changeFormToJSO($("projectsearch"));userSearchName = searchJSO.SITENAME1;searchCon = searchJSO;searchJSO.SITENAME = searchJSO.SITENAME1;searchJSO.BRANCH_IDS=selected_branch_ids;searchJSO.COLUMNNAME='COUNTRY_NAME';BoWxPlanSiteService.getColumnRecords(searchJSO,function(jso){treeData.COUNTRY_NAME=jso.COUNTRY_NAME;var id ="Xs";treeData[id]=changeListToTreejso(treeData.COUNTRY_NAME,["COUNTRY_NAME","COUNTRY_NAME"]);treeObj[id] = _showMultiCheckTree(treeData[id], "TreeDiv"+id, "_tree"+id);});}//alert(args[0]);currentType=type;var id ="";if(currentType=="业务区"){currentType=id =id =shaixuan_ids[0];}else if(currentType=="站点建设状态"){currentType=id =shaixuan_ids[2];}else if(currentType=="工程阶段"){currentType=id =shaixuan_ids[3];}else if(currentType=="项目名称"){currentType=id =shaixuan_ids[5];}else if(currentType=="铁塔设计文本"){currentType=id =shaixuan_ids[4];}else if(currentType=="项目编号"){currentType=id =shaixuan_ids[6];}else if(currentType=="县市"){currentType=id =shaixuan_ids[1];$("TreeDiv"+id).innerHTML="";}$("shaixuan"+id).style.display="block";var o=getInfo(window.event.srcElement.parentNode);$("shaixuan"+id).style.left=o.left;$("shaixuan"+id).style.top=o.bottom;}//创建筛选divfunction createShaixuanDiv(id){var div =document.createElement("DIV");div.className="excel_search";div.id="shaixuan"+id;div.style.display="none";div.innerHTML="<div name='' id='centerFrame' style='width:100%;height:100%'>"+"<div id='TreeDiv"+id+"' style='background-color:#ffffff;width:100%;overflow:auto'></div>"+"<table id='_tree"+id+"' style='display:none' >"+"<tr>"+"<td isChecked='CHECKED' enableThreeStateCheck='true' img='/acwsui/js/xtree/imgs/csh_vista/' id='ID' parentId='PARENT'>"+"NAME"+"</td>"+"</tr>"+"</table>"+"</div>"+"<div>"+"<ul>"+"<li>"+"<input type='button' style='width:50px' onclick='makeShaixuan(\""+id+"\")' value='确定' ></input>"+"<input type='button' style='width:50px' onclick='cancelShaixuan(\""+id+"\")' value='取消'></input>"+"</li>"+"</ul>"+"</div>";document.body.appendChild(div);}//隐藏筛选框function hideAllShaixuan(){for(var i=0;i<shaixuan_ids.length;i++){try{$("shaixuan"+shaixuan_ids[i]).style.display="none";}catch(e){alert(shaixuan_ids[i]);alert($("shaixuan"+shaixuan_ids[i]));}}}