Can't pass checkbox value via ajax

I have a table retrieved from a database:

<p id="result"></p> 
<?php
//$id = $_SESSION['staff_id'];

$teamResult = getQuarter($leader_id);
$count1 = 0;
if (mysqli_num_rows($teamResult) > 0) 
{
?>   

    <table id="confirm">             
      <tr>
        <th>1st Quarter</th>
      </tr>
    <?php
    while($row = mysqli_fetch_array($teamResult))
    {
        $staff_id = $row['staff_id'];
        $username = $row['username'];
        $date1 = $row['date1']; $fdate1 = $row['fdate1']; $q1 = $row['q1']; $cfm1 = $row['cfm1'];
    ?>
      <tr>
        <td>
        <?php if($date1 != NULL){
                echo "Ev.date: ".$date1."<br/> Fb.date: ".$fdate1.""
                    ."<input type='text' id='stid' name='confirm' class='confirm' value='". $q1. "| " . $staff_id ."'>";
            }else {echo "";} 
        ?> 
        </td>
      </tr>
     <?php
    $count1++;
    }
} else {
        echo "<h2>No Data to Display</h2>";
    }
?>                
</table> 

      

This field has a checkbox, but I changed it to text to see its value:

<input type='text' id='stid' name='confirm' class='confirm' value='". $q1. "| " . $staff_id ."'>

      

This is what I got in the table:

enter image description here

Then I have an AJAX function:

<script>
$(function () { 
    $(document).on('click', '.confirm', function(){
        var stid = $("#stid").val();
        $.ajax({
            url: "comAssessment/change.php",
            method: "POST",
            data: {stid: stid},
            dataType:"text",
            success: function (data) {
                $('#confirm').hide();
                $('#result').html(data);
            }
        });  
    });

});  
</script> 

      

And change.php:

$info = $_POST["stid"];
list($value1,$value2) = explode('|', $info);
echo $value1;
echo "<br/>";
echo $value2;

      

But the problem is I am not getting the correct value. For the first and second line, I get 1| 1000302

. Even for the second row, where it should be 1| 1000305

. What is this problem and how can I solve it?

+3


source to share


1 answer


Identifiers must be unique. $("#stid")

will always select the first element with this ID.

You can just use $(this)

to get the value of the item you clicked on.



$(document).on('click', '.confirm', function(){
    var stid = $(this).val();
    $.ajax({
        url: "comAssessment/change.php",
        method: "POST",
        data: {stid: stid},
        dataType:"text",
        success: function (data) {
            $('#confirm').hide();
            $('#result').html(data);
        }
    });  
});

      

+7


source







All Articles