CODEWITHSUNDEEP
javascriptdrop-down-menu
user1400854
user1400854

Reputation: 297

jQuery drop down list

new to javascript / jQuery. I have some data presented in an ordered list as follows

<ul>        
   <li data-id="">
    <a data-link="0" data-actiontype="article" href="#">Data 0</a>
   </li>
   <li data-id="">
    <a data-link="1" data-actiontype="article" href="#">Data 1.</a>
    </li>

    <li data-id="">
    <a data-link="2" data-actiontype="article" href="#">Data 2</a>
    </li>   
 <ul>

I would like to present the above in a drop down list rather on an ordered list please?

Upvotes: 0

Views: 290

Answers (2)

Drew Holiday
Drew Holiday

Reputation: 111

How about

<select>

<option> Data 0 </option>
.
.
.
<option> Data 2 </option>
</select>

To achieve this conversion with JQuery, you need to do something like this:

Have an empty select tag on the page

<select id="randomid"></select>

then add this to your script:

$('ul>li').each(function(i)
{
 $('#randomid').append($(this).text());
});

Upvotes: 1

Quinny
Quinny

Reputation: 209

By drop down list do you mean within one select box or as in hovering over a list item causes the list to appear?

if its the first, just a select tag can be used, with each list item set as an option.

if its the second method, you can give each of the elements a class and set that class to appear only when

Upvotes: 1

Related Questions