[英]How to change background color of table row if quantity column has numeric value less than 10
I am implementing cloth shopping website in which stock is added to the database by admin and admin can view, update and delete stock as well. 我正在实施布料购物网站,在该网站中,管理员将库存添加到库存中,并且管理员也可以查看,更新和删除库存。 while displaying record in table from the database I want that the item from stock thats quantity becomes 10 or less than 10 that row color becomes red so that it should be alert for admin that particular stock quantity is low.
在数据库中的表中显示记录时,我希望库存数量等于10或小于10的项目该行颜色变为红色,以便管理员应警惕特定库存数量低。
CODE: 码:
<table id="myTable">
<tr>
<th>Sr.No</th>
<th>Product ID</th>
<th>Brand</th>
<th>Price</th>
<th>Gender</th>
<th>Category</th>
<th>Material</th>
<th>Size</th>
<th>Description</th>
<th>Quantity</th>
<th>Image</th>
</tr>
<?php
$query = "SELECT * FROM add_stock ORDER BY id DESC;
$rs_result = mysqli_query ($query);
while ($result=mysqli_fetch_array($rs_result) )
{
?>
<tr>
<td><?php echo $result['id']; ?></td>
<td><?php echo $result['brand_name'];</td>
<td><?php echo $result['price']; ?></td>
<td><?php echo $result['gender_name']; ?></td>
<td><?php echo $result['category_name']; ?></td>
<td><?php echo $result['material_name']; ?></td>
<td><?php echo $result['size_name']; ?></td>
<td><?php echo $result['dress_description']; ?></td>
<td><?php echo $result['dress_quantity']; ?></td>
<td><a href="javascript:window.open('<?php echo $result['image'] ?>','mypopuptitle', '_parent')" >View Image</a></td>
</tr>
</table>
<?php
}
?>
<script type="text/javascript">
$('#myTable tr td').each(function(){
var cellValue = $(this).html();
if(!isNaN(parseFloat(cellValue))) {
if (cellValue <= 10) {
$(this).css('background-color','red');
}
}
});
</script>
this is my css code: 这是我的CSS代码:
table {
color: #333;
font-family: Helvetica, Arial, sans-serif;
border-collapse:
collapse; border-spacing: 0;
}
td, th {
border: 1px solid; /* No more visible border */
height: 30px;
transition: all 0.3s; /* Simple transition for hover effect */
}
th {
background: #DFDFDF; /* Darken header a bit */
font-weight: bold;
text-align: center;
height: 50px;
}
td {
background: #FAFAFA;
height: 40px;
}
/* Cells in even rows (2,4,6...) are one color */
tr:nth-child(even) td { background: #F1F1F1; }
/* Cells in odd rows (1,3,5...) are another (excludes header cells) */
tr:nth-child(odd) td { background: #FEFEFE; }
tr td:first-child:before
{
counter-increment: Count-Value;
content: "" counter(Count-Value);
}
Why use javascript
when you can handle that by php
为什么可以使用
php
处理javascript
?
<?php
$query = "SELECT * FROM add_stock ORDER BY id DESC;
$rs_result = mysqli_query ($query);
while ($result=mysqli_fetch_array($rs_result) )
{
?>
/*Check if qty is less then 10 echo style=background-color:red*/
<?php qty = (int)$result['dress_quantity']; ?>
<tr <?php if(qty<10){echo 'style=" background: red !important;"';} ?>>
<td><?php echo $result['id']; ?></td>
<td><?php echo $result['brand_name'];</td>
<td><?php echo $result['price']; ?></td>
<td><?php echo $result['gender_name']; ?></td>
<td><?php echo $result['category_name']; ?></td>
<td><?php echo $result['material_name']; ?></td>
<td><?php echo $result['size_name']; ?></td>
<td><?php echo $result['dress_description']; ?></td>
<td><?php echo $result['dress_quantity']; ?></td>
<td><a href="javascript:window.open('<?php echo $result['image']
?>','mypopuptitle', '_parent')" >View Image</a></td>
</tr>
</table>
<?php
}
?>
您可以在<tr>
标记中回显bgcolor
或css类。
<tr <?php if($result['dress_quantity'] < 10){ echo "bgcolor='#FF0000';} ?>
You better add a class to the cells with quantity like <td class="qty">
and then query for them like 您最好将一个类添加到数量为
<td class="qty">
,然后查询它们,例如
document.querySelectorAll(".qty")
.forEach(td => +td.textContent < 10 && (td.parentElement.sytle.backgroundColor = "red"));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.