繁体   English   中英

如何在表单中自己定义 $_POST 变量?

[英]How can I define a $_POST variable myself in a form?

我正在尝试制作一个列表,其中每一行都有提交请求的人的请求类型、名字和姓氏。 此外,每行有两个按钮,一个接受或拒绝按钮。 按下任一按钮后,我需要使用按下按钮所在行的 request_id,以便从数据库中的 requests 表中删除正确的行。

解决这个问题的正确方法是什么?

以下是我尝试实现这一目标的方法:

<?php for ($j = 0; $j < count($requests); $j++): ?>
    <tr id=' <?php echo $requests[$j]['request_id'] ?>' class="table-row">
       <?php if ($requests[$j]['request_type'] == '1') {
          $request_type = 'candidate';
          } else {
          $request_type = 'voter';
          } ?>
       <form method="POST" action="../assets/php/accept-requests.inc.php">
          <?php $_POST['request_id'] = $requests[$j]['request_id'];?>
          <td class="school"><?=$request_type?></td>
          <td class="name"><?=$requests[$j]['first_name']?></td>
          <td class="candidates"><?=$requests[$j]['last_name']?></td>
          <td> <button id="acceptReq" name="acceptReq" value="req_accepted" type="submit" class="btn btn-success">Accept</button> </td>
          <td> <button id="denyReq" name="denyReq"value="req_denied" type="submit" class="btn btn-danger">Deny</button> </td>
       </form>
       <!-- TODOTODO make these buttons accept or deny -->
    </tr>
<?php endfor; ?>

我不明白"How can I define a $_POST variable myself in a form?" 因为代码中出现的内容在处理表单方面没有任何意义,因为后面引用了两个按钮并从数据库中删除内容。

如果您在页面加载时分配 POST 变量(如此处),一旦实际提交表单,它们将不再存在。 代替常规表单、字段和提交模型,可以使用具有正确 ID 的隐藏字段,但多年来常用的方法是使用 AJAX 发送请求。 通过使用 AJAX,用户体验通常更加精致。

下面从按钮中删除 ID 属性,不手动分配将不使用的 POST 变量,而是发送带有 2 个参数的 ajax 请求 - 即IDtype 后一个参数可以在 PHP 逻辑中使用,以确定单击了哪个按钮,从而确定在服务器上运行哪个逻辑。 这是未经测试的,但给出了一个想法。

<?php for ($j = 0; $j < count($requests); $j++): ?>
    <tr id=' <?php echo $requests[$j]['request_id'] ?>' class="table-row">
        <?php 
            if ($requests[$j]['request_type'] == '1') {
                $request_type = 'candidate';
            } else {
                $request_type = 'voter';
            } 
        ?>
        <!--
        
            Remove the ID attributes from the buttons and use the `event`
            to find the parent Table-Row from which the ID can be retrieved.
            
            Once found the ID can be used in an AJAX request to perform
            whatever tasks are necessary and the callback function then manipulates
            the DOM ... or whatever.
            
        -->
        <td class="school"><?=$request_type?></td>
        <td class="name"><?=$requests[$j]['first_name']?></td>
        <td class="candidates"><?=$requests[$j]['last_name']?></td>
        <td> <button data-type='accept' name="acceptReq" value="req_accepted" type="submit" class="btn btn-success">Accept</button> </td>
        <td> <button data-type='deny' name="denyReq" value="req_denied" type="submit" class="btn btn-danger">Deny</button> </td>
    </tr>
<?php endfor; ?>


</table>

<script>

    let fd=new FormData();

    document.querySelectorAll('button[name="acceptReq"],button[name="denyReq"]').forEach( bttn=>bttn.addEventListener('click',function(e){
        let tr=this.parentNode.closest('tr');
        
        fd.set('id',tr.id);
        fd.set('type',this.dataset.type);
        
        fetch('../assets/php/accept-requests.inc.php',{ method:'post',body:fd })
            .then(r=>r.text())
            .then(text=>{
                //this is the callback
                alert(text)
            })
    }));
</script>

 let fd = new FormData(); document.querySelectorAll('button[name="acceptReq"],button[name="denyReq"]').forEach(bttn => bttn.addEventListener('click', function(e) { let tr = this.parentNode.closest('tr'); fd.set('id', tr.id); fd.set('type', this.dataset.type); fetch('../assets/php/accept-requests.inc.php', { method: 'post', body: fd }) .then(r => r.text()) .then(text => { //this is the callback alert(text) }) .catch(e=>{ console.log('Computer says No! %s',e) }) }));
 *{ transition:ease-in-out all 100ms; font-family:monospace } th{ background:rgba(50,50,100,0.5); color:white; } tr{ margin:0.25rem; } tr:hover td{ background:rgba(0,200,0,0.25); } td, th{ margin:0.25rem; border:1px dotted rgba(0,0,0,0.3); padding:0.45rem } button:hover{ cursor:pointer; } [data-type='accept']:hover{ background:lime } [data-type='deny']:hover{ background:red; color:white; }
 <table> <tr> <th>Assignment</th> <th>Forename</th> <th>Surname</th> <th colspan=2>Vote</th> </tr> <tr id='1' class="table-row"> <td class="school">candidate</td> <td class="name">Geronimo</td> <td class="candidates">Bogtrotter</td> <td> <button data-type='accept' name="acceptReq" value="req_accepted" type="submit" class="btn btn-success">Accept</button> </td> <td> <button data-type='deny' name="denyReq" value="req_denied" type="submit" class="btn btn-danger">Deny</button> </td> </tr> <tr id='2' class="table-row"> <td class="school">candidate</td> <td class="name">Horatio</td> <td class="candidates">Nelson</td> <td> <button data-type='accept' name="acceptReq" value="req_accepted" type="submit" class="btn btn-success">Accept</button> </td> <td> <button data-type='deny' name="denyReq" value="req_denied" type="submit" class="btn btn-danger">Deny</button> </td> </tr> <tr id='3' class="table-row"> <td class="school">voter</td> <td class="name">John</td> <td class="candidates">Smith</td> <td> <button data-type='accept' name="acceptReq" value="req_accepted" type="submit" class="btn btn-success">Accept</button> </td> <td> <button data-type='deny' name="denyReq" value="req_denied" type="submit" class="btn btn-danger">Deny</button> </td> </tr> </table>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM