单击[关闭]后如何禁用按钮

How can I disable my button if after I click it? Example when I click button ACCEPT it will disabled that button and so on. Its like this after I click the button "Accept" that button should be disabled(and the button for "Cancel") then I'll click the button "Send" then that button should also be disabled(in this process the "Delivered" button only is enabled)

Here is what my code look a like. In the button the code for all button, I just include all the code. I hope you guys can help me with this. Thanks!

<?php 

include_once 'ordermodal2.php';
/** *ordermodal.php **/

 $id = "";
 $order_date = "";
 $order_time = "";
 $order_id = "";
 $order_deliverCharge = "";
 $order_status = "";
 $order_totalAmount= ""; 
 $coordinates = "";
 $driver_number = "";
 $address = "";

$food_name= "";
$specal_request= "";
$quantity= "";
$amount= "";



         ?>

         <!-- MODALS --> <!-- DETAILS --> 
         <div id="myModal" class="modal fade" role="dialog" style="z-index: 1400;">
         <div class="modal-dialog modal-lg">
         <div class="modal-content">
        <form action="" method="post" class="form-horizontal">
         <div class="modal-header">
         <button type="button" class="close" data-dismiss="modal" ><center>&times;</button>
     <h4 class="modal-title" id="titleModal">Order Information</h4>
     </div>
         <div class="modal-body"> 

  <div class="form-group">
 <label for="order_id" class="col-sm-2 control-label">Order ID</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="ORDER_ID" id="ORDER_ID" placeholder="" value="" required="required" readonly> 
</div>
</div>

 <div class="form-group">
 <label for="id" class="col-sm-2 control-label">User ID</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="user_id" id="user_id" placeholder="" value="" required="required" readonly> 
 </div> 
 </div>

  <div class="form-group">
 <label for="order_date" class="col-sm-2 control-label">Order Date</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="order_date" id="order_date" placeholder="" value="" required="required" readonly> 
 </div> 
 </div>

  <div class="form-group">
 <label for="order_time" class="col-sm-2 control-label">Order Time</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="order_time" id="order_time" placeholder="" value="" required="required" readonly> 
 </div> 
 </div>

 <div class="form-group"> 
 <label for="order_deliverCharge" class="col-sm-2 control-label">Delivery Charge</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="order_deliveryCharge" id="order_deliveryCharge" placeholder="" value="" required="required" readonly>
 </div> 
 </div> 

  <div class="form-group"> 
 <label for="order_totalAmount" class="col-sm-2 control-label">Total Amount</label>
 <div class="col-lg-3"> 
 <input type="text" input style="width:500px" class="form-control" name="order_totalAmount" id="order_totalAmount" placeholder="" value="" required="required" readonly>
 </div> 
 </div> 

 <div class="form-group">
 <label for="address" class="col-sm-2 control-label">Address</label> 
 <div class="col-lg-3">
 <input type="text" input style="width:500px" class="form-control" name="address" id="address" placeholder="" value="" required="required" readonly>
 </div> 
 </div>

 <div class="form-group">
 <label for="coordinates" class="col-sm-2 control-label">Coordinates</label> 
 <div class="col-lg-3">
 <input type="text" input style="width:500px" class="form-control" name="coordinates" id="coordinates" placeholder="" value="" required="required" maxlength="11" readonly>
 </div> 
 </div>

 <div class="form-group">
 <label for="driver_number" class="col-sm-2 control-label">Driver Number</label> 
 <div class="col-lg-3">
 <input type="text" input style="width:500px" class="form-control" name="drivers_number" id="drivers_number" placeholder="" value="" required="required" readonly>
 </div> 
 </div>

 <div class="form-group">
 <label for="order_status" class="col-sm-2 control-label">Order Status</label> 
 <div class="col-lg-3">
 <input type="text" input style="width:500px" class="form-control" name="order_status" id="order_status" placeholder="" value="" required="required" readonly>
 </div> 
 </div>

  <?php 
  if(isset($_POST['ORDER_ID'])){  
$order_id = trim(addslashes($_POST['ORDER_ID']));
$sql = "SELECT food_name, special_request, quantity, amount 
FROM cart_tbl
WHERE order_id=$order_id";
$result = mysqli_query(connection2(), $sql);}
?>
<table class="table table-hover table-bordered">
 <thead>
 <tr> 
 <th>Food</th>
 <th>Special Request</th>
 <th>Quantity</th>
 <th>Amount</th> 
 </tr>
 </thead> 
 <?php
if(mysqli_num_rows($result)>0)
{
    while($row = mysqli_fetch_array($result))
    {
?>
<tr>
<td><?php echo $row["food_name"];?></td>
<td><?php echo $row["special_request"];?></td>
<td><?php echo $row["quantity"];?></td>
<td><?php echo $row["amount"];?></td>
</tr>
<?php
    }
}
?>

</table>
 </div>
 <div class="modal-footer">
<button type="submit" input style="background-color:##FF0000;color:white;float:left" name="showFood" id="showFood" class="btn btn-primary " onclick="if(!confirm('Are you sure you want to see food order?')){return false;}" > Show Food</button>
<button type="submit" input style="background-color:#4CAF50;color:white" name="submitDelivered" id="submitDelivered" class="btn btn-primary " onclick="if(!confirm('Are you sure you want to deliver order?')){return false;}" > Delivered </button>
<button type="submit" input style="background-color:#0000FF;color:white" name="submitAccept" id="submitAccept" class="btn btn-primary" onclick="if(!confirm('Are you sure you want to accept order?')){return false;}" > Accept </button>
 <button type="button" style="background-color:#FFFF00;color:black" class="btn btn-success" data-toggle="modal" data-target="#myDropdown"> Send </button> 
 <button type="submit" input style="background-color:#f44336;color:white" name="submitCancel" class="btn btn-danger" onclick="if(!confirm('Are you sure you want to cancel order?')){return false;}">Cancel</button> 
  <?php
if(isset($_POST['submitDelivered'])){  
  $order_id = trim(addslashes($_POST['ORDER_ID']));
  $driver_number= trim(addslashes($_POST['drivers_number']));
  $query = "UPDATE order_tbl SET `order_status`='Delivered' WHERE `order_id` = $order_id";
  if (mysqli_query(connection2(), $query)) { 
         mysqli_query(connection2(), "COMMIT");
         $_SESSION['message'] = "Order Delivered"; } 
         else { 
         $_SESSION['message'] = mysqli_error(connection2());
         mysqli_query(connection2(), "ROLLBACK");
         }

  if($_POST['drivers_number']!=0){      
  $query2 = "UPDATE driver_tbl SET `order_id`='' WHERE `driver_number` = $driver_number";
  if (mysqli_query(connection2(), $query2)) { 
         mysqli_query(connection2(), "COMMIT");
         }
    }
  }

  if(isset($_POST['submitAccept'])){  
  $order_id = trim(addslashes($_POST['ORDER_ID']));
  $driver_number= trim(addslashes($_POST['drivers_number']));
  $query = "UPDATE order_tbl SET `order_status`='Accepted' WHERE `order_id` = $order_id";
  if (mysqli_query(connection2(), $query)) { 
         mysqli_query(connection2(), "COMMIT");
         $_SESSION['message'] = "Order Accepted"; } 
         else { 
         $_SESSION['message'] = mysqli_error(connection2());
         mysqli_query(connection2(), "ROLLBACK");
         }

  if($_POST['drivers_number']!=0){      
  $query2 = "UPDATE driver_tbl SET `order_id`='' WHERE `driver_number` = $driver_number";
  if (mysqli_query(connection2(), $query2)) { 
         mysqli_query(connection2(), "COMMIT");
         }
    }
  }


  if(isset($_POST['submitCancel'])){  
  $order_id = trim(addslashes($_POST['ORDER_ID']));
  $driver_number= trim(addslashes($_POST['drivers_number']));
  $query = "UPDATE order_tbl SET `order_status`='Cancelled' WHERE `order_id` = $order_id";
  if (mysqli_query(connection2(), $query)) { 
         mysqli_query(connection2(), "COMMIT");
         $_SESSION['message'] = "Order Cancelled"; } 
         else { 
         $_SESSION['message'] = mysqli_error(connection2());
         mysqli_query(connection2(), "ROLLBACK");
         }

  if($_POST['drivers_number']!=0){      
  $query2 = "UPDATE driver_tbl SET `order_id`='' WHERE `driver_number` = $driver_number";
  if (mysqli_query(connection2(), $query2)) { 
         mysqli_query(connection2(), "COMMIT");
         }

    }
  }

  ?>
 <script type="text/javascript">
 var x = document.getElementsByName("order_status").value;

 if(x== "Accepted"){
     document.getElementsByName("submitAccept").disabled = true;
     document.getElementsByName("submitCancel").disabled = true;
 }
  if(x== "Dispatched"){
     document.getElementsByName("submitAccept").disabled = true;
     document.getElementsByName("submitCancel").disabled = true;
     document.getElementsByName("send").disabled = true;
 }
  if(x== "Delivered"){
     document.getElementsByName("submitDelivered").disabled = true;
 }

 </script>
 </div>
 </form>
 </div>
 </div>
 </div>

写回答
好问题 0 提建议
追加酬金
关注问题
分享
邀请回答
编辑收藏删除结题
收藏举报

2条回答默认最新

关注

码龄粉丝数原力等级 --

被采纳

被点赞

采纳率
普通网友 2017-09-28 13:07
关注
You definitely want to do this in JavaScript, and you can use this code to do the same thing on any one of your other buttons too.

When JavaScript gets a click on the #submitAccept element, it will disable the button. Also, be sure to include jQuery to use this code.

$( "#submitAccept" ).click(function() { $(this).attr('disabled','disabled'); });

<button type="submit" input style="background-color:#0000FF;color:white" name="submitAccept" id="submitAccept" class="btn btn-primary" onclick="if(!confirm('Are you sure you want to accept order?')){return false;}" > Accept </button> <script src="https://code.jquery.com/jquery-1.10.2.js"></script>

Or for a plain javascript version, keeping with your inline onclick functions, use: this.disabled=true;

<button type="submit" input style="background-color:#0000FF;color:white" name="submitAccept" id="submitAccept" class="btn btn-primary" onclick="if(!confirm('Are you sure you want to accept order?')){return false;} this.disabled=true;" > Accept </button>

</div>
解决无用
评论打赏
分享
举报

评论

按下Enter换行，Ctrl+Enter发表内容

报告相同问题？

关注问题

单击PHP后禁用按钮 javascript jquery php
2014-08-03 09:30

回答 1 已采纳 I suggest to you use cookie to keep user state or data. simply you can use cookie in pure javascri
单击按钮提交表单并禁用按钮 html javascript php symfony
2016-07-13 11:03

回答 3 已采纳 I have create one demo. It is working fine. HTML <form> <input type="submit" value=
vue如何实现单击按钮后改变class的某个属性 vue.js 前端
2022-09-02 16:18

回答 8 已采纳 var contents = document,getElementByClass("mes"); for(var i ;i<contents.length;i++){ contents[i
按钮点击事件的禁用和启动
2021-03-08 16:15

argentian的博客一、html按钮标签代码。 <div class="btnBox"> <a href="#" style="background-color: #7097f9" id="btnB" onclick="change()">立即兑换</a> </div> 二、按钮停用的点击事件（一下均...
无论如何使用PHP在服务器端单击一次后永久禁用引导按钮？ html javascript php
2019-05-30 10:12

回答 2 已采纳 There would need to be informed in a database in order for the button to know if it needs to be pr
利用 jQuery 实现单击“获取数据”按钮时，读取数据 data 向表格中添加数据。 html5 jquery 前端
2022-04-07 21:54

回答 3 已采纳 html.append("<td>"+data[i].name+"</td>") 或者 html.append(`<td>${data[i].name}</t
document.querySelector单击后提交数据失败 html5 javascript 前端框架
2022-11-15 12:09

回答 7 已采纳尝试思路：解决方案：把获取元素的语句放在异步获取到数据，赋值给data中的key之后进行。同时需要给获取元素的语句加上setTimeout。因为setTimeout是宏任务，会在vue的render
Web前端 JS WebAPI
2023-03-17 18:36

^微凉夏颜^的博客 i++) { console.log(ipts[i].checked) // 默认没有勾选，返回false // 让三个多选框全部选中 ipts[i].checked = true } // 让第一个复选框为禁用状态 ipts[0].disabled = true script> 自定义属性标准属性：也就是...
单击按钮后如何显示弹出确认 php
2018-05-15 04:19

回答 3 已采纳 you need to make function and use confirm(); <TD style='text-align:left;padding:0;margin:0;'&g
单击按钮后保持选择值 php
2016-09-20 11:37

回答 1 已采纳 use this working code <?php if (isset($_GET["vdag"])) { $dag = $_GET
andriod studio 按钮单击闪退 android-studio
2022-05-06 13:00

回答 3 已采纳贴一下有报错的日志，你这个自定义Toast写的有问题,一般写法是在xml中：如下 View view = LayoutInflater.from(context).inflate(R.layout.
前端常用词汇表
2022-09-19 22:30

李桥桉的博客关闭当前窗口 onblur：失去焦点事件 onkeydown：键盘按下事件（前） date：日期对象 onkeyup：键盘松开事件 onkeypress：键盘按下事件（后） getFullYear（）：年份 getMonth（）：月份（0--11） getDate（）：几号 ...
C# 单击第一个按钮进行循环，单击第二个按钮停止循环 c#
2016-01-30 18:33

回答 3 已采纳在你的循环里加上 Application.DoEvents();
前端实现打印功能
2022-04-15 14:54

网络真危险！！的博客前端实现打印功能的方法有很多，大家在网上随便一搜就是一大堆，在这里，我主要选择一个我觉得比较好一点的实现方式来进行解释描述：方法一：window.print() 这个命令默认打印整个页面的内容，所以，如果想要...
前端基础学习笔记
2023-07-27 14:05

sober30的博客弹性项目相关的css属性 align-self：单独给弹性项目设置对方式 order：改变弹性项目的顺序，数字越大，弹性项目越靠后(可以是负数) 弹性因子收缩因子 flex-basis：设置弹性项目的默认宽度 flex：flex-grow flex-...
前端浏览器使用技巧
2023-02-27 16:32

易小哼唧的博客前端浏览器使用技巧
没有解决我的问题, 去提问

悬赏问题

¥15 Vue3 大型图片数据拖动排序
¥15 划分vlan后不通了
¥15 GDI处理通道视频时总是带有白色锯齿
¥20 用雷电模拟器安装百达屋apk一直闪退
¥15 算能科技20240506咨询（拒绝大模型回答）
¥15 自适应 AR 模型参数估计Matlab程序
¥100 角动量包络面如何用MATLAB绘制
¥15 merge函数占用内存过大
¥15 使用EMD去噪处理RML2016数据集时候的原理
¥15 神经网络预测均方误差很小但是图像上看着差别太大

单击[关闭]后如何禁用按钮

2条回答 默认 最新

悬赏问题

2条回答默认最新