如果特定单元格中的行为零,则标记html表格行

时间:2018-02-21 12:44:57

标签: javascript html-table

我有一个包含数据库表结果的表。这是我的代码:

<?php
 $todayDate = date("Y-m-d");
 $sqlTruck = "SELECT * FROM `truckRecords` WHERE truckWeightDateTimeFull between '$todayDate 00:00:00' and '$todayDate 23:59:59' ORDER BY id DESC";
 $result = $connection->query($sqlTruck);
 // output data of each row
 echo "<table style='width:100%;'  class='tableResults'>
     <tr class='topLine'>
         <th>ID</th>
         <th>User ID</th>
         <th>Ημερομηνία - ώρα</th>
         <th>Βάρος</th>
         <th>Υλικό</th>
         <th>Εταιρεία</th>
         <th>Είδος Οδηγού</th>
         <th>Τιμ/γιο</th>
         <th></th>
         <th></th>
         <th></th>
     </tr>";
     while($row = $result->fetch_assoc()) {
     echo "<tr id='".$row["id"]."'>
             <td class='thRecordID'>".$row["id"]."</td>
             <td>".$row["UserId"]."</td>
             <td>".$row["truckWeightDateTimeFull"]."</td>
             <td class='weightProduct'>".$row["weightProduct"]."</td> // <-- If this cell is equal with zero, addClass "zeroweight" in this table line
             <td>".$row["material"]."</td>
             <td>".$row["companyName"]."</td>
             <td>".$row["driverKind"]."</td>
             <td>".$row["invoice"]."</td>
             <td><a href='#' id='".$row['id']."' class='editRecord'><i class='fas fa-eye'></i> / <i class='fas fa-print'></i></td>
             <td><a href='#' id='".$row['id']."' class='deleteRecord'><i class='fas fa-trash'></i></a></td>
             <td><a href='#' id='".$row['id']."' class='edit_data'><i class='fas fa-pencil-alt'></i></a></td>
          </tr>";
          }
     echo "</table>";
 ?>

正如您所见,className: "weightProduct"表格中有一个单元格。 我正在寻找一个解决方案,当单元格中的值与类名称#34; weightProduct&#34;等于零,addclass&#34; zeroweight&#34;在组合它们的表格行中。

之后我将使用CSS的类名修改此行

我尝试使用Javascript代码,但它无效:

$(document).ready(function(){
    if($("td.weightProduct").text() == 0){
        $("td.weightProduct").parent().addClass("zeroweight");
    }else{
        $("td.weightProduct").addClass("Nozeroweight");
    }
});

3 个答案:

答案 0 :(得分:0)

$(&#34; td.weightProduct&#34;)。text()将在一个字符串中返回weightProduct的所有值。您必须分隔每个td并评估值是否为0

$(document).ready(function(){
var arr = $("td.weightProduct")
for( var i=0; i<arr.length; i++ ){
if($(arr[i]).text() == 0){
$(arr[i]).parent().addClass("zeroweight");
}else{
$(arr[i]).addClass("Nozeroweight");
}
}
});

答案 1 :(得分:0)

由于您在td循环内创建while,我认为有多个。

因此,当您撰写$("td.weightProduct").text()时,您将获得所有td的文本与weightProduct类的串联,这就是为什么$("td.weightProduct").text()永远不等于0 {1}}因为您可能至少有一个td.weightProduct0值。

您需要循环使用元素并更改0值的元素。

$(document).ready(function() {
  $("td.weightProduct").each(function() {
    if ($(this).text() == 0) {
      $(this).parent().addClass("zeroweight")
    } else {
      $(this).addClass("Nozeroweight");
    }
  })
});

答案 2 :(得分:0)

为什么不处理服务器端?

创建一个变量来保存单元格的类。检查值并相应地更改类。

<?php
 $todayDate = date("Y-m-d");
 $sqlTruck = "SELECT * FROM `truckRecords` WHERE truckWeightDateTimeFull between '$todayDate 00:00:00' and '$todayDate 23:59:59' ORDER BY id DESC";
 $result = $connection->query($sqlTruck);
 // output data of each row
 echo "<table style='width:100%;'  class='tableResults'>
     <tr class='topLine'>
         <th>ID</th>
         <th>User ID</th>
         <th>Ημερομηνία - ώρα</th>
         <th>Βάρος</th>
         <th>Υλικό</th>
         <th>Εταιρεία</th>
         <th>Είδος Οδηγού</th>
         <th>Τιμ/γιο</th>
         <th></th>
         <th></th>
         <th></th>
     </tr>";
     while($row = $result->fetch_assoc()) {
     //Changes from here
     $wpClass = "weightProduct";
     if($row["weightProduct"] == 0) {
         $wpClass += " zeroweight"
     }
     echo "<tr id='".$row["id"]."'>
             <td class='thRecordID'>".$row["id"]."</td>
             <td>".$row["UserId"]."</td>
             <td>".$row["truckWeightDateTimeFull"]."</td>
             <td class='" . $wpClass . "'>".$row["weightProduct"]."</td> // <-- If this cell is equal with zero, addClass "zeroweight" in this table line
             <td>".$row["material"]."</td>
             <td>".$row["companyName"]."</td>
             <td>".$row["driverKind"]."</td>
             <td>".$row["invoice"]."</td>
             <td><a href='#' id='".$row['id']."' class='editRecord'><i class='fas fa-eye'></i> / <i class='fas fa-print'></i></td>
             <td><a href='#' id='".$row['id']."' class='deleteRecord'><i class='fas fa-trash'></i></a></td>
             <td><a href='#' id='".$row['id']."' class='edit_data'><i class='fas fa-pencil-alt'></i></a></td>
          </tr>";
          }
     echo "</table>";
 ?>

注意我的PHP有点生疏,因此需要进行一些调试。

如果真的想要做这个客户端,这应该是最简单的方法

$(document).ready(function() {
     $("td.weightProduct").filter(function(){return $(this).text() === "0";}).addClass("zeroweight");
});