Asp.Net DropDown list, expand width to show all options on select

canuckconsulting
canuckconsulting used Ask the Experts™
on
I have an asp.net project which has a dropdownlist.  I have controlled the width to fit on the form but when the user selects from it I wanted the width to expand to show the entire texts of the available entries.  

It is partially doing this naturally I as shown below I just need it to expand a bit more.  Happy to do this via CSS or js.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Big MontyWeb Ninja at large

Commented:
try this out, since you have jQuery as a tag:

<select id="sel">
         <option value="aaaa">aaaa</option>
         <option value="aaaaaaaa">aaaaaaaa</option>
         <option value="aaaaaaaaaaaa">aaaaaaaaaaaa</option>
         <option value="aaaaaaaaaaaaaaaa">aaaaaaaaaaaaaaaa</option>
         <option value="aaaaaaaaaaaaaaaaaaaa">aaaaaaaaaaaaaaaaaaaa</option>
     </select>

     <span id="hidnSpan">

     <span>

<script>

$(document).ready(function()
{
    $('#sel').change(function()
    {
        $('#sel').width( $('#hidnSpan').html($('#sel').find(":selected").text()).width())
    });
});


</script>

Open in new window

If you do not assign a width for the dropdownlist it should automatically adjust the width to meet the longest string

Author

Commented:
It did...I foolishly did not see I was constraining the width upstream in css.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial