当客户订购时,他/她的订单将保存到数据库中,其中所有元素都是Pending
,我将批准或取消他/她的订单。当我单击 Approve 按钮
时,待定订单将被 Delivered
并且如果 Cancel 按钮
,该订单将被 Cancelled
.现在我想要 css success
为所有“已交付”的 td 和 css danger
为那些被取消的。即使我刷新页面,背景颜色也会保持不变。
这是我的表格,看起来像这样:
Date Ordered Order No. Total item(s) Total Amount Order Status
09-11-2015 15-09-0000000001 3 213.85 Pending
09-11-2015 15-09-0000000002 1 130.00 Pending
09-11-2015 15-09-0000000003 2 134.07 Pending
09-11-2015 15-09-0000000004 4 846.41 Pending
<button>Approve Order</button> <button>Cancel Order</button>
这是我的PHP
如您所见我的 td (order_status
)。如果在我单击 Approve 按钮
时 order_status
为“已交付”,我想在我的 css
中调用该 success
.如果 order_status 通过单击 Cancel 按钮
被“取消”,请在我的 css
中调用 danger
。
那么我要执行 if else if 语句吗?
<?php
if(!session_id()){
session_start();
}
include_once '../fileadmin/dbinit.php';
$todo = $_POST['todo'];
$con = mysql_connect("localhost","root","","atec_coop");
if (!$con){
die("Can't connect".mysql_error());
}
mysql_select_db("atec_coop",$con);
switch ($todo) {
case "display":
$sql = "SELECT * from tb_empgroc_master";
// $myData = mysql_query($sql,$con);
$result = $atecCoop->query($sql);
$html = ''; $ctr = 0;
if ($result->num_rows){
while ($row = $result->fetch_object()){
$id = $row->empgrocmstID;
$date_ordered = date("m-d-Y");
$order_no = date($row->order_no);
$total_items = number_format($row->total_items);
$total_amount = number_format($row->total_amount,2);
$order_status = wordwrap($row->order_status);
$Order = $row->empgrocmstID;
$html .= "<tr id='$id'>";
$html .= "<td class='date_ordered' style='text-align:center'>$date_ordered</td>";
$html .= "<td class='order_no' style='text-align:center'>$order_no</td>";
$html .= "<td class='total_items' style='text-align:right'>$total_items</td>";
$html .= "<td class='total_amount' style='text-align:right'>$total_amount</td>";
$html .= "<td id='$Order' class='order_status' style='text-align:center'>$order_status</td>";
$html .= "</tr>";
}
}
echo $html;
break;
case "Cancel":
$Cancelquery = "UPDATE tb_empgroc_master SET order_status='Cancelled' WHERE empgrocmstID='".$_POST['empgrocmstID']."'";
mysql_query($Cancelquery, $con);
break;
case "Approve":
$Approvequery = "UPDATE tb_empgroc_master SET order_status='Delivered' WHERE empgrocmstID='".$_POST['empgrocmstID']."'";
mysql_query($Approvequery, $con);
break;
}
?>
这是我对按钮的 ajax 调用
如您所见,注释了 css
。这行得通,但是当我刷新页面时,背景色
消失了。我评论说 updateTable();
也是因为 background color's
因为表格更新而消失了。所以我希望 td background color
即使我刷新页面也能保留。
$("#Approve").click(function(e) {
e.preventDefault();
var id = $('#cLoanOut tr.active').attr('id');
bootbox.confirm("Are you sure you want to approve order?","No","Yes",function(r){
if(r) {
$.ajax({
url : "<?php echo $server_name; ?>/emcis_coopmain/process/PHP_groceryReleasingProcess.php",
type : "POST",
async : false,
data : {
empgrocmstID:id,
todo:"Approve"
},
success:function(result){
// $('tr.active td.order_status').css("background-color", "green");
bootbox.alert('Order Approved',function(){
$("#Approve").attr("disabled", true);
});
// updateTable();
}
});
} else {
}
});
});
$("#Cancel").click(function(e) {
e.preventDefault();
var id = $('#cLoanOut tr.active').attr('id');
// var x = $('table tr.active').find('td.class').html();
bootbox.confirm("Are you sure you want to cancel order?","No","Yes",function(r){
if(r) {
$.ajax({
url : "<?php echo $server_name; ?>/emcis_coopmain/process/PHP_groceryReleasingProcess.php",
type : "POST",
async : false,
data : {
empgrocmstID:id,
todo:"Cancel"
},
success:function(result){
// $('tr.active td.order_status').css("background-color", "red");
bootbox.alert("Order Cancelled",function(){
$("#Cancel").attr("disabled", true);
});
// updateTable();
}
});
} else {
}
});
});
这是我的CSS
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
background-color: #607d8b;
color: #FFFFFF;
}
div.well{
background-color: #fff9c4;
color: #000000;
}
#cLoanOut .active{
background-color: #2c9e94;
color: #FFFFFF;
}
.table-hover > tbody > tr.active > td.danger:hover {
background-color: red !important;
}
.table-hover > tbody > tr.active > td.warning:hover {
background-color: yellow !important;
}
.table-hover > tbody > tr.active > td.success:hover {
background-color: green !important;
}
还有我的表格
<form class="form-horizontal" id="main-form" action="PHP_groceryReleasingProcess.php" method="POST">
<table class="tablesorter table table-bordered table-condensed" id="cLoanOut" style="table-layout: fixed;">
<colgroup>
<col width="110">
<col width="130">
<col width="50">
<col width="60">
<col width="90">
</colgroup>
<thead>
<tr>
<th>Date Ordered</th>
<th>Order No.</th>
<th>Total Item(s)</th>
<th>Total Amount</th>
<th>Order Status</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<button id="Approve" role="button" class="btn btn-success" disabled>Approve Order</button>
<button id="Cancel" role="button" class="btn btn-danger" disabled>Cancel Order</button>
</form>
我想在我的 CSS
中调用特定 td 中的 danger
和 success
。 'empgrocmstID' 是数据库中的自动递增字段。我知道如何通过将它放在 order_status
的 td 中来调用成功和危险... class='order_status success'
, class='order_status danger'
但这不是重点。
我已经在“显示”案例中尝试了这段代码,但 order_status
的 td 不会显示。
if ($order_status===''){
$html .= "<td id='$Order' class='order_status success' style='text-align:center'>$order_status</td>";
}else if($order_status===''){
$html .= "<td id='$Order' class='order_status danger' style='text-align:center'>$order_status</td>";
}
谢谢你的帮助
最佳答案
你可以简单地在你的数据库中创建另一行你有状态的地方。只需将其设置为 1 = 已批准和 2 = 未批准。 现在你可以做一个简单的 if 并用 2 个不同的 css 来回应它
关于javascript - 如果页面刷新或表格更新,背景颜色将如何保留,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32580584/