0

我使用 CodeIgniter PHP 框架。

我的查看代码：

<?hp
    $nomor_III=1;

    foreach ($listPertanyaanBlokIII as $data){
        echo '<tr>';
        echo '<td>'.$nomor_III.'</td>';                                                        
        echo '<td style="text-align:left;padding-left:5px;">'.$data['jenis_barang'].'</td>';  
        echo '<td>'.$data['id_kualitas_barang'].'</td>';
        echo '<td style="text-align:left;padding-left:5px;">'.$data['kualitas_barang'].'</td>';
        echo '<td>'.$data['satuan'].'</td>';        
        echo '<td>'.form_input('res1_'.$data['id_kualitas_barang'].'').'</td>';
        echo '<td>'.form_input('res2_'.$data['id_kualitas_barang'].'').'</td>';
        echo '<td>'.form_input('res3_'.$data['id_kualitas_barang'].'').'</td>';
        echo '<td style="width:200px;"><textarea name="ket_'.$data['id_kualitas_barang'].'" rows="2" cols="30"></textarea></td>';
        echo '</tr>';

        $nomor_III=$nomor_III+1;
    }
?>

并且，浏览器中的视图：

Num | Product  
----------------
1   | Plate
2   | Plate
3   | Glass
4   | Glass

如何使具有相同描述的数据具有相同的背景颜色？例如“玻璃”变成灰色，“盘子”变成白色，等等。

4

4 回答 4

1

只需将颜色描述添加为一个类。虽然我不了解您的数组键，但它看起来像这样：

echo '<td class="'.$data['description'].'">'.$data['description'].'</td>';

每个描述都有一个相应的类：

.paku {
    background-color: #000000;
}

编辑：如果你想要一个斑马表，你可以使用 CSS3：

tr:nth-child(even) {
  background-color: #DCDCDC;
}

tr:nth-child(odd) {
  background-color: #FFFFFF;
}
于 2013-02-13T13:08:49.800 回答
0

您可以尝试重组您的初始数据集$listPertanyaanBlokIII，使其按产品分组：

Array
(
[plate] => Array
    (
        [0] => plate 123
        [1] => plate 456
    )

[glass] => Array
    (
        [0] => glass 123
        [1] => glass 456
     )
)

然后（简化代码）：

$css_class = 'even';
foreach($listPertanyaanBlokIII as $group => $array){
      $css_class = $css_class == 'even' ? 'odd' : 'even';
      echo $group.'<br>';
          foreach($array as $val){
          echo ' ---- '.$val.' class='.$css_class.'<br>';
          }
 }

输出，这再次只是为了证明这个概念：

plate
---- plate 123 class=odd
---- plate 456 class=odd
glass
---- glass 123 class=even
---- glass 456 class=even
于 2013-02-13T14:00:46.883 回答
0

您可以检查子字符串匹配并根据它应用背景颜色

于 2013-02-13T13:07:43.633 回答
0

您正在寻找的是tbody用于分组目的的元素。您需要修改循环，使您可以将所有相同类型的产品放在同一个 tbody 中。一旦你这样做了，你可以在身体上做斑马条纹。

tbody:nth-child(odd) {
    background: #CCC;
}

<table>
    <tbody>
        <tr>
            <td>1</td>
            <td>Plate</td>
        </tr>

        <tr>
            <td>2</td>
            <td>Plate</td>
        </tr>
    </tbody>

    <tbody>
        <tr>
            <td>3</td>
            <td>Glass</td>
        </tr>

        <tr>
            <td>4</td>
            <td>Glass</td>
        </tr>
    </tbody>
</table>

http://jsfiddle.net/V8xss/

我已经展示了如何修改循环作为另一个问题的答案： Displaying table data column-wise in a while loop（尽管您需要将插入的标签从更改tr为tbody）

于 2013-02-13T14:05:32.470 回答