使用jQuery查找隐藏表单值的值

Question

I hope someone has he answer to my problem...

I'm trying to use jquery to find the value of different hidden fields on a form. My problem is I have multiple forms appearing on the same page (items of a result set for updating) and the jquery only finds the value of the first field. When I click on the div to update the field I only get the ID of the first record.

Here is my code

repeated html

<ul class="task-container-item">
    <form id="task-submit" method="post" name="form">
        <input class="taskID" type="hidden" value="<?php echo $taskID;?>">
        <li><?php echo $name;?></li>
        <li><?php echo $date;?></li>
        <li><?php echo $creator;?></li>
        <li class="description"><?php echo $description;?></li>
    </form>
</ul>   

jquery

$(document).ready(function(){
    $('.task-container-item').click(function(){
         $(this).css("background","green")
         $(this).css("color","#fff");
         var taskID = $(".taskID").val();
         alert (taskID);
    });
});

Hope you can help

Thanks

Dave

Answer 1

Perhaps you could have php increment the forms' inputs' id.

For instance:

<input class="taskID" type="hidden" id="taskid-1" value="<?php echo $taskID;?>">

and then for the next input

<input class="taskID" type="hidden" id="taskid-2" value="<?php echo $taskID;?>">

for(var x=0;x<?php echo $total_forms; ?>;x++){
    //your processing code here
}

Answer 2

Try:

$('input[type=hidden]')

Then you could use .each() for each hidden field.

Answer 3

You can iterate on the list of elements with given class:

var taskIDs = [];
$('.taskID').each(function() {
  taskIDs.push($(this).val());
});

You'll have all the ids in the taskIDs array

update

$(document).ready(function(){
    $('.task-container-item').click(function(){
        $(this).css("background","green")
        $(this).css("color","#fff");
        var taskID = $(this) // Use the element that has been clicked on
                      .find(".taskID") // find the .taskID element in that
                      .val();
        alert(taskID);
    });
});