locked
how to convert a optionset into multi selection picklist in crm 2011 using javasacript?? RRS feed

  • Question

  • hi,

    where user want to select not only one but multiple value from a pick list. I tried  examples but it shows some errors.

    How  to do it??

    Tuesday, September 9, 2014 9:40 AM

All replies

  • Hi Nisha,
    Please see the following link. It works.
    http://slalomdotcom.wordpress.com/2013/01/23/multi-select-option-sets-part-2/
    Regards,
    Jithesh
    Tuesday, September 9, 2014 9:46 AM
  • Don't use picklist here. Use a custom entity.

    Regards Faisal

    Tuesday, September 9, 2014 10:36 AM
  • Hi Nisha,

    Please follow the below steps:

    1. Create an option set with values.

    2. create a Webresource with following code: 

    // var_sc_optionset >>  Provide schema-name for Option Set field
    // var_sc_optionsetvalue >> Provide schema-name for field which will store the multi selected values for Option Set
    // OS >> Provide Option Set field object
    // OSV >> Provide text field object which will store the multi selected values for Option Set
    
    //Method to convert an optionset to multi select Option Set
    function ConvertToMultiSelect(var_sc_optionset, var_sc_optionsetvalue, OS, OSV)
    {
    
    if( OS != null && OSV != null )
    {
      OS.style.display = "none";
      Xrm.Page.getControl(var_sc_optionsetvalue).setVisible(false);
    
      // 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");
    
           addDiv.style.overflowY = "auto";
    
           addDiv.style.height = "80px";
    
           addDiv.style.border = "1px #6699cc solid";
    
           addDiv.style.background = "#ffffff";
    
      OS.parentNode.appendChild(addDiv);
    
      // Initialise checkbox controls
      for( var i = 1; i < OS.options.length; i++ )
      {
        var pOption = OS.options[i];
        if( !IsChecked( pOption.text , OS, OSV) ){
     //     var addInput = document.createElement("<input type='checkbox' style='border:none; width:25px; align:left;' />" );
    	
          var addInput = document.createElement("input" );
     	addInput.setAttribute("type","checkbox");
       	addInput.setAttribute("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 addInput = document.createElement("input" );
     	addInput.setAttribute("type","checkbox");
     	addInput.setAttribute("checked","checked");
     	addInput.setAttribute("style","border:none; width:25px; align:left;");
    
    }
     //   var addLabel = document.createElement( "<label />");
      	var addLabel = document.createElement( "label");
    	addLabel.innerText = pOption.text;
    
        // var addBr = document.createElement( "<br/>"); //it's a 'br' flag
    	
    	var addBr = document.createElement( "br"); //it's a 'br' flag
    
        OS.nextSibling.appendChild(addInput);
        OS.nextSibling.appendChild(addLabel);
        OS.nextSibling.appendChild(addBr);
      }
    }
    }
    
    ///////Supported functions
    
      // Check if it is selected
      function IsChecked( pText , OS, OSV)
      {
        if(OSV.value != "")
        {
          var OSVT = OSV.value.split(";");
          for( var i = 0; i < OSVT.length; i++ )
          {
            if( OSVT[i] == pText )
              return true;
          }
        }
        return false;
      }
    
      // var_sc_optionsetvalue >> Provide schema-name for field which will store the multi selected values for Option Set
      // OS >> Provide Option Set field object
      // Save the selected text, this field can also be used in Advanced Find
      function OnSave(OS, var_sc_optionsetvalue)
      {
        var getInput = OS.nextSibling.getElementsByTagName("input");
        var result = '';
    
        for( var i = 0; i < getInput.length; i++ )
        {
          if( getInput[i].checked)
          {
            result += getInput[i].nextSibling.innerText + ";";
          }
        }
    
        //save value
        control = Xrm.Page.getControl(var_sc_optionsetvalue);
        attribute = control.getAttribute();
        attribute.setValue(result);
    
      }
      

    3. Pass the following parameters  "new_serviceinterest", "new_serviceinterest_value",document.all.new_serviceinterest, document.all.new_serviceinterest_value

    My optionset field name is new_serviceinterest

    • Proposed as answer by Anubhav Bajpai Tuesday, September 9, 2014 11:23 AM
    Tuesday, September 9, 2014 11:17 AM
  • hi,

    Thanks for every one sharing your answers.

     But I have a query if I want to search the selected options using advanced find. I mean I want to search the picklsit value in advanced find not  with the textbox values.

     with the textbox values are records are coming, but I want using picklist value using advanced find.

    Tuesday, September 9, 2014 1:28 PM
  • You can not do this ( It is unsupported) . Instead of using multi picklist , create an entity for these. Create 1-N or N-N relation between your entity and that you created entity for multi picklist. 

    Polat Aydın Crm Software Developer


    Tuesday, September 9, 2014 1:54 PM
  • Polat is correct, you have to create a lookup instead of a picklist fir your requirement.

    regards,Jithesh



    Tuesday, September 9, 2014 10:47 PM
  • hi Anubhav Bajpai 

    I have to do a multi slect pick list, I follow you'r post but I don't understand step 3 : Pass the following parameters 

    the parameters is on the js ? or no my optionset field si new_books.

    if I understand I have to do "new_books", "new_books_value",document.all.new_books, document.all.new_books_value but after I lost.

    can you help for or should have to pass the parameters 

    Thanks you 

    Friday, May 1, 2015 11:03 PM
  • Hey I meet a problème on my development see my result :

    link : https://social.microsoft.com/Forums/getfile/652331

    a multiple select list on my crm 2013 I do this process on this forum :

    link : https://social.microsoft.com/Forums/en-US/2db47a59-165d-40c9-b995-6b3262b949eb/how-to-convert-a-optionset-into-multi-selection-picklist-in-crm-2011-using-javasacript?forum=crmdevelopment

    my development :

    // var_sc_optionset >>  Provide schema-name for Option Set field
    // var_sc_optionsetvalue >> Provide schema-name for field which will store the multi selected values for Option Set
    // OS >> Provide Option Set field object
    // OSV >> Provide text field object which will store the multi selected values for Option Set
    
    //Method to convert an optionset to multi select Option Set
    function ConvertToMultiSelect(var_sc_optionset, var_sc_optionsetvalue, OS, OSV)
    {
    
    if( OS != null && OSV != null )
    {
    
      OS.style.display = "none";
      Xrm.Page.getControl(var_sc_optionsetvalue).setVisible(false);
    
      // Create a DIV container
    //  var addDiv = document.createElement("<div style='overflow-y:auto; color:#000000; height:160px; border:1px #6699cc solid; background-color:#ffffff;' />");
         var addDiv = document.createElement("div");
    
           addDiv.style.overflowY = "auto";
    
           addDiv.style.height = "160px";
    
           addDiv.style.border = "1px #6699cc solid";
    
           addDiv.style.background = "#ffffff";
    
           addDiv.style.color = "#000000";
    
      OS.parentNode.appendChild(addDiv);
    
      // Initialise checkbox controls
      for( var i = 1; i < OS.options.length; i++ )
      {
        var pOption = OS.options[i];
        if( !IsChecked( pOption.text , OS, OSV) ){
     //     var addInput = document.createElement("<input type='checkbox' style='border:none; width:25px; align:left;' />" );
    	
          var addInput = document.createElement("input" );
     	addInput.setAttribute("type","checkbox");
       	addInput.setAttribute("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 addInput = document.createElement("input" );
     	addInput.setAttribute("type","checkbox");
     	addInput.setAttribute("checked","checked");
     	addInput.setAttribute("style","border:none; width:25px; align:left;");
    
    }
     //   var addLabel = document.createElement( "<label />");
      	var addLabel = document.createElement( "label");
    	addLabel.innerText = pOption.text;
    
        // var addBr = document.createElement( "<br />"); //it's a 'br' flag
    	
    	var addBr = document.createElement( "br"); //it's a 'br' flag
    
        OS.nextSibling.appendChild(addInput);
        OS.nextSibling.appendChild(addLabel);
        OS.nextSibling.appendChild(addBr);
      }
    }
    }
    
    ///////Supported functions
    
      // Check if it is selected
      function IsChecked( pText , OS, OSV)
      {
        if(OSV.value != "")
        {
          var OSVT = OSV.value.split(";");
          for( var i = 0; i < OSVT.length; i++ )
          {
            if( OSVT[i] == pText )
              return true;
          }
        }
        return false;
      }
    
      // var_sc_optionsetvalue >> Provide schema-name for field which will store the multi selected values for Option Set
      // OS >> Provide Option Set field object
      // Save the selected text, this field can also be used in Advanced Find
      function OnSave(OS, var_sc_optionsetvalue)
      {
        var getInput = OS.nextSibling.getElementsByTagName("input");
        var result = '';
    
        for( var i = 0; i < getInput.length; i++ )
        {
          if( getInput[i].checked)
          {
            result += getInput[i].nextSibling.innerText + ";";
          }
        }
    
        //save value
        control = Xrm.Page.getControl(var_sc_optionsetvalue);
        attribute = control.getAttribute();
        attribute.setValue(result);
    
      }

    I have to do 2 field one is option list field and the second is textfield, 

    option list field : new_books

    textfiled          : new_picklistvalue

    my js is on onload event see : 

    link : https://social.microsoft.com/Forums/getfile/652333

    thanks you for you'r help 

    Saturday, May 2, 2015 2:54 PM