I have created a custom 'drop down list' (that stays open), of fuel weights using labels. I did this because I wanted to show the drop down list Open on iOS devices. Native lists in iOS are always folded up. Anyway, this design works fine as I can click on a label item and get the weight (100) and the moment (298.16) value from the list. All well and good.
The last feature I need I can't figure out how to do. I want to make a click event call and have the weight highlighted and pull the moment out into a variable.
Here is my open label 'list':
<label class="fuellist_click fuel_colors" data-fuel_moment="298.16">100</label>
<label class="fuellist_click fuel_colors" data-fuel_moment="591.18">200</label>
<label class="fuellist_click fuel_colors" data-fuel_moment="879.08">300</label>
etc.
etc.
This is my code below when I manually click on a fuel weight to get the weight and the moment value:
$('.fuelLoad').mousedown(function(event) {
switch (event.which) {
case 1:
//Left Mouse button pressed
$(this).val(fuel_weight);
document.getElementById('idfuelLoadMoment').innerHTML = parseFloat(fuel_moment).toFixed(2);
break;
case 2:
//Middle Mouse button pressed
break;
case 3:
//Right Mouse button pressed
$(this).val(0);// set value to 0
return false;
break;
default:
}
});
<INPUT TYPE="text" ID="idfuelLoad" class="fuelLoad" value="<?php echo $fuelLoad?>">