javascript - 单击按钮修改表列数据

Question

我正在使用 PhP-Mysql 制作休假管理系统。

我有一个表，它在申请休假时接受用户的输入。 (姓名、休假类型、起始日期、截止日期、主管、原因和状态)。只有状态列具有预定义值“待处理”。

现在我想在每一行引入两个按钮(接受/拒绝)。单击该按钮将更改“状态”字段的值。

我不知道该怎么做，我尝试过更新表列，但只有在存在 where 条件时才会更新，这不是这种情况下的正确过程。

<div id="content">   
<?php
$connect = new mysqli("127.0.0.1","root","","leavedb"); 
$sql = "SELECT 
name,
leavetype,
fromdate,
todate,
supervisor,
reason,
DATEDIFF(todate,fromdate) as Days,
status as Status
FROM leavereq";
$result = $connect->query($sql);    
?>

<table id="myTable">
    <tr>                                                
        <th>Name</th>
        <th>Leave Type</th>   
        <th>From Date</th>
        <th>To Date</th>
        <th>Supervisor</th>
        <th>Reason</th>
        <th>No. of Days</th>
        <th>Status</th>
    </tr>                                   

    <?php
        while ($report=$result->fetch_assoc()) 
        {                                 
        echo "<tr>";  
        echo "<td>".$report['name']."</td>"; 
        echo "<td>".$report['leavetype']."</td>";
        echo "<td>".$report['fromdate']."</td>";
        echo "<td>".$report['todate']."</td>";
        echo "<td>".$report['supervisor']."</td>";
        echo "<td>".$report['reason']."</td>";
        echo "<td>".$report['Days']."</td>";
        echo "<td>".$report['Status']."</td>";
        echo "<td>" . '<input type="submit" name="approve" value="Approve">' . "</td>";
        echo "<td>" . '<input type="submit" name="reject" value="Reject">' . "</td>";                                
        }
    ?>
</table>
</div>

Answer 1

//In the html : You have to add unique id for every <td> of status & also wants to change the input type of approve & reject...also require javascript
// check below
<script>
function function_name(status_id,req)
{
var status;
status='status'+status_id;
if(req=='approve')
{
document.getElementById(status).innerHTML='approve';
//pass ajax call to update entry in db
}
else if(req=='reject')
{
document.getElementById(status).innerHTML='reject';
//pass ajax call to update entry in db
}
</script>

<table id="myTable">
    <tr>                                                
        <th>Name</th>
        <th>Leave Type</th>   
        <th>From Date</th>
        <th>To Date</th>
        <th>Supervisor</th>
        <th>Reason</th>
        <th>No. of Days</th>
        <th>Status</th>
    </tr>                                   

    <?php
$i=0;
        while ($report=$result->fetch_assoc()) 
        {                                 
        echo "<tr>";  
        echo "<td>".$report['name']."</td>"; 
        echo "<td>".$report['leavetype']."</td>";
        echo "<td>".$report['fromdate']."</td>";
        echo "<td>".$report['todate']."</td>";
        echo "<td>".$report['supervisor']."</td>";
        echo "<td>".$report['reason']."</td>";
        echo "<td>".$report['Days']."</td>";
        echo "<td id='status$i'>pending</td>";
        echo "<td>" . '<button type="button" name="approve"'.$i.' onClick="return function_name($i,approve);">Approve</button>' . "</td>";
        echo "<td>" . '<button type="button" name="reject"'.$i.' onClick="return function_name($i,reject);">Reject</button>' . "</td>";  
        $i++;                              
        }
    ?>
</table>