Thursday 3 November 2011

Multi-select Picklist using javascript in crm4.0

MultiSelectPicklist= function(picklist, textfield){
 
  
  // PL - the picklist attribute; PLV - used to save selected picklist values
  var PL = document.getElementById(picklist);
  var PLV = document.getElementById(textfield);
  if (!PLV || textfield ==''){PLV = null;}
 
  if( PL != null && PLV != null ){
   PL.style.display = "none";
  //PLV.style.display = "none";
 
   // Create a DIV container
   var addDiv = document.createElement("<div style='overflow-y:auto; height:80px; border:1px #6699cc solid; background-color:#ffffff;' />");
 //  var addDiv = document.createElement("<div style='overflow-y:auto; height:80px; border:1px #6699cc solid; background-color:#EAF3FF;' />");
   PL.parentNode.appendChild(addDiv);
 
   // Initialise checkbox controls
   for( var i = 1; i < PL.options.length; i++ ){
    var pOption = PL.options[i];
    if (!IsChecked( pOption.text ))
     var addInput = document.createElement("<input type='checkbox' name="+pOption.text+" value="+pOption.value+" style='border:none; width:25px; align:left;' onclick='picklistOnClick("+picklist+","+textfield+")' />" );
    else
     var addInput = document.createElement("<input type='checkbox' name="+pOption.text+" value="+pOption.value+" checked='checked' style='border:none; width:25px; align:left;' onclick='picklistOnClick("+picklist+","+textfield+")' />" );
     
    var addLabel = document.createElement( "<label />");
    addLabel.innerText = pOption.text;
 
    var addBr = document.createElement( "<br>"); //it's a 'br' flag
 
    PL.nextSibling.appendChild(addInput);
    PL.nextSibling.appendChild(addLabel);
    PL.nextSibling.appendChild(addBr);
   }
 
   // Check if it is selected
   function IsChecked(pText){
    if (!PLV) return;
 
    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
   //20110222 GP: pass the name of the picklist and textfield to store each selection in case multiple multi-select picklists are created
   picklistOnClick = function(oPL,oPLV){
    if (!oPLV) return;
 
    oPLV.value = "";
    var getInput = oPL.nextSibling.getElementsByTagName("input");
    for( var i = 0; i < getInput.length; i++ ){
     if( getInput[i].checked){
      oPLV.value += getInput[i].nextSibling.innerText + "||";
     }
    }
   }
  }
 }
gMultiSelectPicklist('new_picklist', 'new_textfield'); //build multi-select picklist and save the items in text field
 
 gMultiSelectPicklist('new_picklist');//build multi-select picklist  ONLY
 var PL = crmForm.all.new_picklist;
 var getInput = PL.nextSibling.getElementsByTagName("input");

No comments:

Post a Comment