客户要求picklist能四级联动并且还要在第一级里选好某一项后其他几级多选实现效果如图:
图一:
图二:
多选的效果是参照jimwang的多选改的 代码如下:
if(class1 == 1) { crmSDKSample.filterChildField("new_class1", "new_class3"); crmSDKSample.filterChildField("new_class1", "new_class4"); if( PL != null && PLV != null ) { if(document.getElementById('picklist1')!=null) { var divlist =document.getElementById('picklist1'); var lnodes = divlist.childNodes; for (i=0;i<lnodes.length;i++) { if(lnodes[i].nodeName=='LABEL') { divlist.removeChild(lnodes[i]); } } for (i=0;i<lnodes.length;i++) { if(lnodes[i].nodeName=='INPUT') { if(lnodes[i].type=='checkbox') { divlist.removeChild(lnodes[i]); } } } for (i=0;i<lnodes.length;i++) { if(lnodes[i].nodeName=='BR') { divlist.removeChild(lnodes[i]); } } for (i=0;i<lnodes.length;i++) { if(lnodes[i].nodeName=='BR') { divlist.removeChild(lnodes[i]); } } for (i=0;i<lnodes.length;i++) { if(lnodes[i].nodeName=='BR') { divlist.removeChild(lnodes[i]); } } } else { // Create a DIV container var addDiv = document.createElement("<div id='picklist1' style='overflow-y:auto; height:80px;border: 1px #6699cc solid;background-color: #ffffff;' />"); PL.parentNode.appendChild(addDiv); } PL.style.display = "none"; //PLV.style.display = "none"; //crmForm.all.new_class2value_c.style.display = "none"; //crmForm.all.new_class2value_d.style.display = "none"; //debugger; // Initialise checkbox controls for( var i = 1; i < PL.options.length; i++ ) { var pOption = PL.options[i]; if( !IsChecked1( pOption.text ) ) var addInput = document.createElement("<input type='checkbox' style='border:none; 25px; align:left;' />" ); else var addInput = document.createElement("<input type='checkbox' checked='checked' style='border:none; 25px; align:left;' / >" ); var addLabel = document.createElement( "<label id=lab1"+ i +"/>"); addLabel.innerText = pOption.text; var addBr = document.createElement( "<br />"); PL.nextSibling.appendChild(addInput); PL.nextSibling.appendChild(addLabel); PL.nextSibling.appendChild(addBr); } // Check if it is selected function IsChecked1( pText ) { if(PLV.value != "") { var PLVT = PLV.value.split("||"); for( var i = 0; i < PLVT.length; i++ ) { if( PLVT[i] == pText ) return true; } } return false; } // Save the selected text, this filed can also be used in Advanced Find //crmForm.attachEvent( "onsave" , OnSave); function OnSave() { PLV.value = ""; var getInput = PL.nextSibling.getElementsByTagName("input"); for( var i = 0; i < getInput.length; i++ ) { if( getInput[i].checked) { PLV.value += getInput[i].nextSibling.innerText + "||"; } } } } }
主要加一些代码,在第一级选其他项是移走多选效果 ,还有jimwang的blog里是把多选结果存在隐藏字段里,我的也是只是在保存的代码放在OnSave事件里没在此处启用。
至于picklist如何四级联动在CRMSDK里已经有很好的例子啦。