How to create a Multiple Selection Picklist in CRM 4.0

In CRM 4.0 by default we do not have a Picklist where to select multiple items. In the post below I am giving the details to get this functionality.

Firstly, we create a Picklist with all values.

Then, we create a text field which is going to store the selected values from the multi-value Picklist.

Using the following script we extend the Picklist functionality to allow it to select multiple values. We change new_mypicklist and new_mypicklistvalue by the names of previously created attributes.

The code was extracted from this post

var PL = crmForm.all.new_mypicklist;
var PLV = crmForm.all.new_mypicklistvalue;

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;' />");
  PL.parentNode.appendChild(addDiv);

  // Initialize 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' style='border:none; width:25px; align:left;' />" );
    else
      var addInput = document.createElement("<input type='checkbox' checked='checked' style='border:none; width:25px; align:left;' />" );

    var addLabel = document.createElement( "<label />");
    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 IsChecked( 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 selected text
  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 + "||";
      }
    }
  }
}

Now, we are going to insert this code in the Form OnLoad() event. In order to do this we select Settings > Customizations > Customize Entities and choose the entity where we want to put the multi-value Picklist.

We go to the entity form and click in Form Properties and Edit the Event OnLoad().

Verify the checkbox “The Event is Enabled” is checked.

The field that contains the values “new_mypicklistvalue”, must be in the page. We can hide its label but we cannot completely hide it, as it is going to take the script.

As loading the page takes some time, in order to load the jscript making the field containing the values not visible, what we can do is to put that field in another tab, for example in the tab Notes which is always present by default.

So this way it is not seen when the page is loading.

Regards!

Santiago Gonnet