[RESOLVED]how to add html DIV control inside DROPDOWNLIST Control.

Hi,

I want to add colors in downtown list .How I can do that one.

I used following code but not working proper. After selecting option it should change the background color of selected list. 

Regards,

Vishal Bedre 

<body>
    <form id="form1" runat="server">
    <div>
        <select id="select1" runat="server" style="width:200px">
            <option style="background-color: yellow"></option>
            <option style="background-color: green"></option>
        </select>
    </div>
    </form>
    <script type="text/javascript">
        $(document).ready(function () {
            debugger;
            $('#select1').change(function () {
                var option = this.options[this.selectedIndex];
                // $('#select1').removeAttr('style');
                $('#select1').css('background-color',  + $(option).css('background-color') + );
            });
        });
    </script>
</body>

<form id="form1" runat="server">
    <div>
        <select id="select1" runat="server" style="width: 200px">
            <option style="background-color: yellow"></option>
            <option style="background-color: green"></option>
        </select>
    </div>
    </form>
    <script type="text/javascript">
        $(document).ready(function () {
            debugger;
            $('#select1').change(function () {
                var option = this.options[this.selectedIndex];
                $('#select1').css('background-color', rgb2hex($(option).css('background-color')));
            });
        });

        function rgb2hex(rgb) {
            rgb = rgb.match(/^rgba?[s+]?([s+]?(d+)[s+]?,[s+]?(d+)[s+]?,[s+]?(d+)[s+]?/i);
            return (rgb && rgb.length === 4) ? "#" +
  ("0" + parseInt(rgb[1], 10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2], 10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3], 10).toString(16)).slice(-2) : '';
        }
    </script>

Leave a Reply