CODEWITHSUNDEEP
ajaxlistjquery
Maverick
Maverick

Reputation: 2760

how to get value of this ul list

The code is this:

<ins>
    <div class="dropdown">
        <ins>&nbsp;</ins>
        <ul id="eventselect">
            <li><a href="javascript:;" rel="Birthdays">Birthdays</a></li>
            <li><a href="javascript:;" rel="Graduation">Graduation</a></li>
            <li><a href="javascript:;" rel="Wedding">Wedding</a></li>
            <li><a href="javascript:;" rel="Farewell">Farewell</a></li>
            <li><a href="javascript:;" rel="Party">Party</a></li>
            <li><a href="javascript:;" rel="Bbq">Bbq</a></li>
            <li><a href="javascript:;" rel="Party">Party</a></li>
            <li><a href="javascript:;" rel="Warming_party">Housewarming</a></li>
            <li><a href="javascript:;" rel="Christmas">Christmas</a></li>
            <li><a href="javascript:;" rel="Other">Other</a></li>
        </ul>
    </div>
</ins>

I have tried following code for to access the value:

$("#eventselect").val();
$("#eventselect :selected").text();

But nothing worked, now my question is how to get the value of this please.

EDIT - 1

Hi guys, sorry, I realized that i shouldnt have used this $("#eventselect :selected").text(); . There is a problem which I am getting the list starts with an empty select box, which I think comes from that <ins>&nbsp;</ins>, and if I remove that I am not getting anything in the list. And with that tag inside I can access the value or text by using $("#eventselect li").text();. But the value is birthdays even when the blank first li is there. How to rectify it?

Upvotes: 0

Views: 11903

Answers (1)

Guilherme David da Costa
Guilherme David da Costa

Reputation: 2368

A way of accessing the "selected value" of an UL its if you can distinct one from the others, maybe with a class. Let's say the selected one get to have the selected class on the LI element. Then you could access it like this:

$('#eventselect li.selected a').text();

or maybe if you want the rel attribute:

$('#eventselect li.selected a').attr('rel');

Where one way of distinct the selected one from the others it's doing something like this:

$('#eventselect li a').click(function(){
    $('#eventselect li').removeClass('selected'); // remove all selected class values
    $(this).parent().addClass('selected'); // add class selected to selected value
});

You can get the selected value with the click event too, like this:

$('#eventselect li a').click(function(){
    $(this).attr('ref'); // Get the ref attribute from the "a" element
});

Upvotes: 4

Related Questions