Last post Apr 07, 2015 03:33 AM by Fei Han - MSFT
Member
429 Points
1829 Posts
Apr 06, 2015 06:47 PM|asplearning|LINK
Hello everyone, I would love to add background color to ajax cascading dropdown list when the parent control is selected. Here is my mark up:
<div> <asp:DropDownList ID="ddlTest" runat="server"> <asp:ListItem>Test1</asp:ListItem> <asp:ListItem>Test2</asp:ListItem> </asp:DropDownList> </div> <div class="row margin10"> <div> <cc1:MyDropdownList ID="ddlCountry" runat="server" DataTextField="country_name" DataValueField="country_id" ValidationGroup="product"></cc1:MyDropdownList> <ajaxToolkit:CascadingDropDown ID="cdlCountry" TargetControlID="ddlCountry" PromptText="-- Select country --" PromptValue="0" ServicePath="~/service/CascadingDdl.asmx" ServiceMethod="GetCountry" runat="server" Category="country_id" LoadingText="Loading..." /> </div> <div> <cc1:MyDropdownList ID="ddlState" runat="server" ValidationGroup="product" DataTextField="state_name" DataValueField="state_id"></cc1:MyDropdownList> <ajaxToolkit:CascadingDropDown ID="cdlState" TargetControlID="ddlState" PromptText="-- Select state --" PromptValue="0" ServicePath="~/service/CascadingDdl.asmx" ServiceMethod="GetState" runat="server" Category="country_id" ParentControlID="ddlCountry" LoadingText="Loading..." /> </div> </div>
So I want to add background color to the ddlState when ddlCountry is selected. Here is my javascript to add the style:
$("select[id*=ddlCountry]").change(function () { $("select[id*=ddlState]").each(function () { $(this).children('option').css("background-color", "red"); }); });
But this doesn't work. I tested my js code to this:
$("select[id*=ddlCountry]").change(function () { $("select[id*=ddlTest]").each(function () { $(this).children('option').css("background-color", "red"); }); });
Then this will work. But I need to populate the child dropdown list dynamically. Anyone knows how I can fix this?
Thanks.
All-Star
40535 Points
6233 Posts
Microsoft
Apr 07, 2015 03:33 AM|Fei Han - MSFT|LINK
Hi,
Thanks for your post.
Please try the following code to change background-color of “ddlState” options.
$(function () { $("select[id*=ddlCountry]").change(function () { $("select[id*=ddlState]").children("option").each(function () { $(this).css("background-color", "red"); }); }) })
Best Regards,
Fei Han
Member
429 Points
1829 Posts
Styling ajax cascading dropdown how please?
Apr 06, 2015 06:47 PM|asplearning|LINK
Hello everyone, I would love to add background color to ajax cascading dropdown list when the parent control is selected. Here is my mark up:
So I want to add background color to the ddlState when ddlCountry is selected. Here is my javascript to add the style:
But this doesn't work. I tested my js code to this:
Then this will work. But I need to populate the child dropdown list dynamically. Anyone knows how I can fix this?
Thanks.
All-Star
40535 Points
6233 Posts
Microsoft
Re: Styling ajax cascading dropdown how please?
Apr 07, 2015 03:33 AM|Fei Han - MSFT|LINK
Hi,
Thanks for your post.
Please try the following code to change background-color of “ddlState” options.
Best Regards,
Fei Han