I'm trying to get the Value of a Listbox made of li via button Click. I searched the web but the most solutions are with the onClick button on the listbox itself. I tried something like this.
Listbox:
echo("</head><body><ul id='selectable'>");
while($satz != null)
{
echo "<li class='ui-widget-content' id='userid' value='$satz[ID]'>$satz[username]</li>";
$satz=mysql_fetch_assoc($cursor);
}
echo("</ul></body></html>");
JQuery:
$(document).ready(function()
{
$("#del").click(function()
{
var id = document.getElementById('selectable li').value;
alert(id);
But ID is undefined, what to do? Thanks.
I'm trying to get the Value of a Listbox made of li via button Click. I searched the web but the most solutions are with the onClick button on the listbox itself. I tried something like this.
Listbox:
echo("</head><body><ul id='selectable'>");
while($satz != null)
{
echo "<li class='ui-widget-content' id='userid' value='$satz[ID]'>$satz[username]</li>";
$satz=mysql_fetch_assoc($cursor);
}
echo("</ul></body></html>");
JQuery:
$(document).ready(function()
{
$("#del").click(function()
{
var id = document.getElementById('selectable li').value;
alert(id);
But ID is undefined, what to do? Thanks.
Share Improve this question edited Jan 27, 2014 at 8:48 Preprocezzor asked Jan 27, 2014 at 8:40 PreprocezzorPreprocezzor 3071 gold badge6 silver badges17 bronze badges 5-
2
ul
element doesn't havevalue
property. Also note that IDs must be unique. – Ram Commented Jan 27, 2014 at 8:41 - instead od value use data-value – Alen Commented Jan 27, 2014 at 8:42
- The IDs are unique because I got them from the database. The Listbox is filled with users, ID and username included. How to get the selected ID of li? – Preprocezzor Commented Jan 27, 2014 at 8:44
-
"The IDs are unique because I got them from the database." I meant ID attributes, not value of the
value
attributes, where is the#del
element? – Ram Commented Jan 27, 2014 at 8:52 - Oh, ok. The #del Button is on the same page like the JQuery Function and the Listbox. But the function of the listbox is on another page, I included the page with included_once. Did you meant the Id of the li tags? Is it wrong that they have the same ID called 'userid' – Preprocezzor Commented Jan 27, 2014 at 8:56
1 Answer
Reset to default 1ul
element doesn't work like the select
element, ie it doesn't have a selected option(value). That's why other solutions suggest listening to the click event of the li
elements. You should either use a select
element instead of the ul
element:
$("#del").click(function() {
var id = $('#selectable').val();
});
Or add an identifier like a specific className to the target li
element:
$("#del").click(function() {
var id = $('#selectable li.selected').attr('value');
});
That being said please note that your markup is invalid because:
- You are using the same ID for several elements, IDs are supposed to be unique. Here classes should be used instead.
value
is not a valid attribute for theli
element, you should usedata-*
attributes instead. Then you can read the values using jQuery.data()
method. Supposing you have adata-value
attribute for reading the value, you can code:$('#selectable li.selected').data('value')
.- You are generating
body
element with it's contents and also including another page.