"тнιѕ вℓσg ¢συℓ∂ ѕανє уσυя мσηєу ιƒ тιмє = мσηєу" - ∂.мαηנαℓу

Tuesday, 1 March 2011

How to Filter a Picklist / Option set based on another Picklist / Option set using Javascript in MS Dynamics CRM 2011



The following post was done long time back. So please refer this link http://msdn.microsoft.com/en-us/library/gg594433.aspx

//Please refer the above link
In MS Dynamics CRM 2011, it is possible to filter a picklist based on another. Javascript would be an ideal method to achieve this.Lets consider that we have two pick lists  - picklistOne and picklistTwo. So when we choose a value from picklistOne, the other one should populate values based on this.


Its a good way to design the picklist values prior to do this. In the following picture, the first rectangle represents picklistOne and next one represents picklistTwo. The advantage of this design is we could easily identify related items of first picklist by looking at the fist 3 digits.
For Instance, item 10001,10002 are identified as the related item of 100
For instance, first picklist could be populated with days,months and years. Hence the related values of the same would be displayed in the next picklist based on the selected value of the first picklist.
Defining the picklist options:



Next part is to write a function to filter items of second picklist based on the selected item of the first picklist.


function PicklistOneOnchange() {

    var picklistOneAttribute = "new_picklistone";
    var picklistTwoAttribute = "new_picklisttwo";
    var picklistOne = document.getElementById(picklistOneAttribute);
    var picklistTwo = document.getElementById(picklistTwoAttribute);

    var picklistOneSelectedValue = picklistOne.DataValue;
    if (picklistTwo.flag == true) {
//a varibale originalPicklistValues is used to retain
// the original values of the picklist 
        picklistTwo.Options = picklistTwo.originalPicklistValues;

    }
    else {

        picklistTwo.originalPicklistValues = picklistTwo.Options;
        picklistTwo.flag = true;
//flag-to identify when the original picklist values to be reassigned 
    }

   if (picklistOneSelectedValue != null)
    {
        for (var i = picklistTwo.length - 1; i >= 0; i--) {           
            if (picklistTwo.Options[i].DataValue != null && picklistTwo.Options[i].DataValue != "") {
                if (picklistTwo.Options[i].DataValue.substring(0, 3) != picklistOneSelectedValue) 
{
                    picklistTwo.remove(i);
//removes unrelated items and displays only related items.
                }
            }
        }
    }
}




8 comments:

  1. I cannot get this to work. I had to make my digits out to 7 spots because of the solution prefix requirements.

    I added in my two option list field names under the "new_picklistone" and "newpicklisttwo" and changed the the 3 to a 7 for the substring, that should be it right?

    ReplyDelete
  2. Hello Michael,
    Thanks for reading my blog. Hope you got the point that we should bring some dependency between these two option lists by designing the values of the optionlist. Also we don't need to worry about the display text in the optionlist.
    For instance value 100 in optionset1 - related values 10001, 10002 etc in optionset2.
    Where as value 200 in optionset2 related values could be 20001, 20002 etc in optionset2
    So 100, 200 will act as identifiers.Or you could call them as keys.The second optionlist is prefixed with these keys or identifiers.
    Now coming to your case, you could have 7 digits for the optionlist1
    So For instance
    1000000
    2000000
    In that case 2nd optionlist should be designed with these keys
    so it could be 100000001 , 100000002 which are related to identifier 1000000
    and 200000001 ,200000002 etc for identifier 2000000
    This design is important and as you said the code change is right in that case.
    Normally CRM suggests values between 100 000 000
    and 100 009 999 for the optionlist. But CRM will accept values between 0 and
    2,147,483,646.
    I hope this helps you.

    ReplyDelete
  3. Greetings again. I wrote the code and put it in the OnChange for my "Primary Industry" field and keep getting zy_newprimaryindustry is undefined. Here is my code, do you know why this would be happening?

    function FilterOptionSet()
    {
    var picklistTwoAttribute = zy_newsubindustry;
    var picklistOneAttribute = zy_newprimaryindustry;
    var picklistOne = document.getElementById(picklistOneAttribute);
    var picklistTwo = document.getElementById(picklistTwoAttribute);

    var picklistOneSelectedValue = picklistOne.DataValue;
    if (picklistTwo.flag == true)
    {
    //a variable originalPicklistValues is used to retain
    // the original values of the picklist
    picklistTwo.Options = picklistTwo.originalPicklistValues;
    }
    else
    {
    picklistTwo.originalPicklistValues = picklistTwo.Options;
    picklistTwo.flag = true;
    //flag-to identify when the original picklist values to be reassigned
    }

    if (picklistOneSelectedValue != null)
    {
    for (var i = picklistTwo.length - 1; i >= 0; i--)
    {
    if (picklistTwo.Options[i].DataValue != null && picklistTwo.Options[i].DataValue != "")
    {
    if (picklistTwo.Options[i].DataValue.substring(0, 7) != picklistOneSelectedValue)
    {
    picklistTwo.remove(i);
    //removes unrelated items and displays only related items.
    }
    }
    }
    }
    }

    ReplyDelete
  4. Hello Again Michael,
    I think its just because
    var picklistTwoAttribute = "zy_newsubindustry";
    var picklistOneAttribute = "zy_newprimaryindustry";
    The attribute names must be in double quotes as we are referring it. Because of that document.getElementById couldn't find the attribute and its value. Please amend this and let me know whether you have any issues.

    ReplyDelete
  5. How will this function if picklistone has more than 9 options 100,200...900, can i then use 1000?

    ReplyDelete
  6. Hello Tim,
    its all custom values. Even if you use 101 102 etc for first option set its fine but the related option set should be defined accordingly. For instance...the second option set values 10101,10102 for the items of 101 and second option set values 10201, 10202,10203 etc for the items of 102. The idea is simple we are establishing some kind of identity for each option set and relate them based on the values. The first option set value is the prefix for second option set value.Hope its clear to you.

    ReplyDelete
  7. The approach you're recommending is an unsupported customization in CRM because you're referencing the form elements using the DOM instead of the CRM Client Script SDK. Why do you prefer this approach over the "Create Dependent Option Sets" sample in the SDK?

    http://msdn.microsoft.com/en-us/library/gg594433.aspx

    ReplyDelete
  8. Thank you very much from Germany!
    I used this code very easily on our crm 4.0!

    i just had to change this line "if (picklistTwo.Options[i].DataValue.substring(0, 3) != picklistOneSelectedValue)" i had to make a 1 out of the 3 and it works without hesitation (i guess because i used for the first 1, 2, 3,4 and for the second 11, 12, 21, 22 and so ;)

    so thanks very much works like a charm!

    ReplyDelete