Microsoft Dynamics CRM (Archived)

Multiple Select Option Set

(0) Share

Report

Posted on by microsoft dynamics ...

950

Hello!

Can anybody help me with this:

I have two (html) Dropdowns(DDL1 & DDL2) in which the values get filled dynamically based on a WebService call.

My requirement is - when i select DDL1, the values in DDL2 should be filled based on DDL1 selected value.Is this possible?

Any suggestions would be a great help!

Thanks,

Manu.

*This post is locked for comments

I have the same question (0)

All responses (14)

Answers (1)

Suggested answer

Community Member on at

Like (0)

Report

yes, through javascript use ajax. check this example.

http://jsfiddle.net/Usy2j/5/

Was this reply helpful? Yes No
microsoft dynamics ... 950 on at

Like (0)

Report

Hi Mak!

The link which u sent me doesn't open.

Manu.

Was this reply helpful? Yes No
microsoft dynamics ... 950 on at

Like (0)

Report

It is fine now... Will check it.

Thanks.

Was this reply helpful? Yes No
microsoft dynamics ... 950 on at

Like (0)

Report

Mike!

I tried this already! But my problem here is the OptionSet is not static.The values get filled dynamically for both the Optionsets. My requirement is: If i select one OptionSet value, the other OptionSet should get filled with the related value selected(regarding products of a company which are not static).

Please let me know if there is any possibility!

Thanks,

Manu.

Was this reply helpful? Yes No
Suggested answer

Community Member on at

Like (0)

Report

it is working

code is here, include jqurry 1.9.1

html

<fieldset id="location-fieldset">
    <legend>Choose your pickup location</legend>
    <div class="pu-country-container ">
        <label for="pu-country">Country</label>
        <select id="pu-country" name="country">
            <option value="0">Choose</option>
            <option value="A">A</option>
            <option value="B">B</option>
            <option value="C">C</option>
        </select>
    </div>
    <div class="pu-city-container ">
        <label for="pu-city">City</label>
        <select id="pu-city" name="city" disabled="">
            <option value="0">Choose</option>
        </select>
    </div>
    <div class="pu-location-container ">
        <label for="pu-location">Location</label>
        <select id="pu-location" name="location" disabled="">
            <option value="0">Choose</option>
        </select>
    </div>
</fieldset>

javascript

var x;

$('#pu-country').on('change', function () {
    if (this.value != '0') {
        $('#pu-city').prop('disabled', false);
        $('#pu-city').find("option").not(":first").remove();
        $('#pu-location').prop('disabled', true);
        $('#pu-location').val("Choose");
        switch (this.value) {
            case 'A':
                x = '<option value="A.1">A.1</option><option value="A.2">A.2</option><option value="A.3">A.3</option>'
                break;
            case 'B':
                x = '<option value="B.1">B.1</option><option value="B.2">B.2</option><option value="B.3">B.3</option>'
                break;
            case 'C':
                x = '<option value="C.1">C.1</option><option value="C.2">C.2</option><option value="C.3">C.3</option>'
                break;
        }
        $('#pu-city').append(x)
    } else {
        $('#pu-location').prop('disabled', true);
        $('#pu-location').val("Choose");
        $('#pu-city').prop('disabled', true);
        $('#pu-city').val("Choose");
    }

});

$('#pu-city').on('change', function () {
    if (this.value != '0') {
        $('#pu-location').prop('disabled', false);
        $('#pu-location').find("option").not(":first").remove();

        switch (this.value) {
            case 'A.1':
                x = '<option value="A.1.1">A.1.1</option><option value="A.1.2">A.1.2</option><option value="A.1.3">A.1.3</option>'
                break;
            case 'A.2':
                x = '<option value="A.2.1">A.2.1</option><option value="A.2.2">A.2.2</option><option value="A.2.3">A.2.3</option>'
                break;
            case 'A.3':
                x = '<option value="A.3.1">A.3.1</option><option value="A.3.2">A.3.2</option><option value="A.3.3">A.3.3</option>'
                break;
            case 'B.1':
                x = '<option value="B.1.1">B.1.1</option><option value="B.1.2">B.1.2</option><option value="B.1.3">B.1.3</option>'
                break;
            case 'B.2':
                x = '<option value="B.2.1">B.2.1</option><option value="B.2.2">B.2.2</option><option value="B.2.3">B.2.3</option>'
                break;
            case 'B.3':
                x = '<option value="B.3.1">B.3.1</option><option value="B.3.2">B.3.2</option><option value="B.3.3">B.3.3</option>'
                break;
            case 'C.1':
                x = '<option value="C.1.1">C.1.1</option><option value="C.1.2">C.1.2</option><option value="C.1.3">C.1.3</option>'
                break;
            case 'C.2':
                x = '<option value="C.2.1">C.2.1</option><option value="C.2.2">C.2.2</option><option value="C.2.3">C.2.3</option>'
                break;
            case 'C.3':
                x = '<option value="C.3.1">C.3.1</option><option value="C.3.2">C.3.2</option><option value="C.3.3">C.3.3</option>'
                break;
        }

        $('#pu-location').append(x)
    } else {
        $('#pu-location').prop('disabled', true);
        $('#pu-location').val("Choose");
    }

});

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report

It depends on what the web resource is doing. but far and away the easiest option is to call the parent of the iframe (ie. the crm form) in your IFrame's javascript and update it using (for example) parent.Xrm.Page.getAttribute("new_dropDownExample").setValue("yourValue").

Was this reply helpful? Yes No
Suggested answer

Community Member on at

Like (0)

Report

i mentioned earlier

use ajax to load dynamic data based on the selection, see my blog

makdns.blogspot.com/.../crm-feed-parse-json.html

create json for both dropdown list, use ajax and load it dynamically.

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report

I'm confused as to why the OP's suggestion would need ajax; If, as can be inferred from everything that has been said thus far, the data has been loaded into an optionset within the iframe, one need only utilise a client language to manage the data. hence my suggestion above. have an event listener in your js (e.g. <body onload=""> ) that calls the parent page (parent.Xrm.Page.etc.etc.) From a user point of view, the whole process would happen instantaneously.

Was this reply helpful? Yes No
microsoft dynamics ... 950 on at

Like (0)

Report

Hello Jonniosaurus!

Can you please give me any example with explanation on how the above thing works?

I made two Webservice calls and got the data filled in the HTML dropdowns(onclick event).

When one value from the dropdown (ddl1) is selected, the dropdown(ddl2) value should get selected based on the index of first dropdown(ddl1) selected value .

How to do this?Any suggestions would be a great help!

Thanks,

Manu.

Was this reply helpful? Yes No
Community Member on at

Like (0)

Report

Hi Manu,

Can I clarify something... are you:

a) populating a dropdown in an HTML webresource with data and then wanting to do the same for an optionset in a CRM form (ie NOT in a web resource)

b) trying to populate a dropdown in one webresource and then pass that data to another HTML webresource with an optionset

c) tyring to populate 2 dropdowns that are in one HTML web resource.

if a) then you would approach the javascript as you would a normal website. so, to the html body of your webresource, you can add <script> tags and have events called as and when you need them (e.g. onload/onclick etc.). The only difference from a simple website client script is that you want to make a call to the parent of the iframe. Let's say you set the event to occur onclick when someone selects an option in ddl on your webresource; in the corresponding function in your JS you would have a call to the parent (namely, the CRM form) which would look something like the following: parent.Xrm.Page.getAttribute("yourOptionset").setValue("relevantValue") -- bear in mind that CRM stores integers as optionset values (there's a function that'll return the name of the option but i forget it off the top of my head) e.g.

var n = 0

// assuming crm optionset "new_sandwich" has values of: 1000000 == "cheese" ...1 == "tomato" ...2 == "lettuce"

switch(valueFromClick) {

case "cheese":

n = 1000000;

break;
case "tomato":

n = 1000001;

break;

case "lettuce":

n = 1000002;

break;

}

if (n) parent.Xrm.Page.getAttribute("new_sandwich").setValue(n);

else alert("error, you must select a value");

________________________________

b) this is much like a) except you'd need to refresh the second IFrame (web resources are basically just IFrames but where CRM manages the hosting) from the first and pass it the parameters as a POST/GET/etc.

_________________________________

c) as with a) but no need to call parent.Xrm.etc.etc. you could just call document.getElementById etc. etc.

_______________________________

Hope that helps!

Was this reply helpful? Yes No

Community site session details

Multiple Select Option Set

Helpful resources

Quick Links

Responsible AI policies

Neeraj Kumar – Community Spotlight

Congratulations to the November Top 10 Community Leaders!

Leaderboard > 🔒一 Microsoft Dynamics CRM (Archived)

Featured topics

Product updates

Community site session details

Multiple Select Option Set

Helpful resources

Quick Links

Responsible AI policies

Neeraj Kumar – Community Spotlight

Congratulations to the November Top 10 Community Leaders!

Subscribe to this forum!

Select categories

Leaderboard > 🔒一 Microsoft Dynamics CRM (Archived)

Featured topics

Product updates