對數據庫中的foreach插入到表中的行進行排序

我有一個從數據庫中提供內容的表。表中有一個標準的表頭行，然後我有一個foreach（），它從一個包含信息中獲取信息並將其吐出到表體中。（插入一個新的每個條目。）對數據庫中的foreach插入到表中的行進行排序

我需要表格最初按日期閉合列排序，而不是符號列。我現在用的是Tablesorter插件，我試着這樣做：

$(document).ready(function() { 
    // call the tablesorter plugin 
    $("#bin").tablesorter({ 
     // sort on the first column and third column, order asc 
     sortList: [[6,1],[0,0]] 
    }); 
});

這工作，但問題是我有一個應用到每隔一行從在foreach的背景下，當表分揀機分揀行當頁面加載時，背景顏色不是每隔一個，而是在桌面分揀機零星的地方移動這些行。

這裏是我的代碼：

<table cellspacing="0" cellpadding="0" id="bin" width="100%"> 
     <thead> 
      <tr> 
       <th style="text-align:left; padding-top: 20px;" width="10%">Symbol <img src="/images/sort-arrow.jpg" alt="Sort by Symbol" class="sort-right move-left bottom-image"/></th> 
       <th style="text-align:left;" width="20%">Company<br><span class="move_right">Name</span> <img src="/images/sort-arrow.jpg" alt="Sort by Company Name" class="sort-right move-left"/></th> 
       <th style="text-align:left; padding-top: 20px;" width="23%">Industry <img src="/images/sort-arrow.jpg" alt="Sort by Industry" class="sort-right move-left bottom-image"/></th> 
       <th style="text-align:center;" width="10%"><span class="center-text">Buy</span><br>Date <img src="/images/sort-arrow.jpg" alt="Sort by Buy Date"/></th> 
       <th style="text-align:center;" width="10%"><span class="center-text">Buy</span><br>Price &nbsp;<img src="/images/sort-arrow.jpg" alt="Sort by Buy Price"/></th> 
       <th style="text-align:center;" width="10%"><span class="center-text">Closed</span><br>Price &nbsp;<img src="/images/sort-arrow.jpg" alt="Sort by Closed Price"/></th> 
       <th style="text-align:center;" width="10%"><span class="center-text">Closed</span><br>Date &nbsp;<img src="/images/sort-arrow.jpg" alt="Sort by Closed Date"/></th> 
       <th style="text-align:center;" width="10%"><span class="center-text">Total</span><br>Return &nbsp;<img src="/images/sort-arrow.jpg" alt="Sort by Current Return"/></th> 
      </tr> 
     </thead> 
     <tbody> 
<?php 
    foreach($buylist as $a) { 
     $bg = ($c % 2) ? ' class="even"' : ''; 
     //$direction = (is_numeric($a['creturn']) && $a['creturn'] >= 0) ? 'up_green' : 'down_red'; 
     //$tick = (is_numeric($a['creturn']) && $a['creturn'] >= 0) ? '<img src="/images/icon_up.png">' : '<img src="/images/icon_down.png">'; 
     //$tick2 = (is_numeric($a['cchange']) && $a['cchange'] >= 0) ? '<img src="/images/icon_up.png">' : '<img src="/images/icon_down.png">'; 
     //$tick3 = (is_numeric($a['final_return_pct']) && $a['final_return_pct'] >= 0) ? '<img src="/images/icon_up.png">' : '<img src="/images/icon_down.png">'; 
     $type = ''; 
     $entry_price = (is_numeric($a['buyprice'])) ? '$'.$a['buyprice'] : '&ndash;'; 
     $sold_price = (is_numeric($a['sold_price'])) ? '$'.$a['sold_price'] : '&ndash;'; 
     $total_return= sprintf("%.02f", (($a['sold_price'] - $a['buyprice'])/$a['buyprice']) * 100); 
?> 
      <tr<?=$bg;?>> 
       <td ><b><a href="/gamechangers/getaquote/?symbolsearch=<?php echo $a['symbol']; ?>"><?=$a['symbol'];?></a></b><?=$type;?></td> 
       <td><?=$a['name'];?></td> 
       <td valign="top"><?=$a['industry'];?></td> 
       <td align="center"><?=$a['buydate'];?></td> 
       <td align="center"><?=$entry_price;?></td> 
       <td align="center"><?php echo $sold_price; ?></td> 
       <td align="center"><?=$a['sold_date'];?></td> 
       <td align="center"><?php echo $total_return; ?>%</td> 
      </tr> 
<?php 
     $c++; 
    } 
?> 
     </tbody> 
    </table>

CSS的表：

table#bin, table#fallen, table#growth, table#turn { margin:10px 0; border:1px solid #ccc; } 
th, td { padding:10px 7px; } 
tr th { background:#ededed; color:#545454; font-weight:bold; cursor:pointer;} 
#bin tr.even td { background:#e1eff1; } 
#turn tr.even td { background:#f7f2d8; } 
#fallen tr.even td { background:#f2dcbd; } 
#growth tr.even td { background:#deefdc; } 
td.title a { text-decoration:none; display:block; text-transform:uppercase; font-weight:bold;} 
#bin td.title { background:#5198a0; } 
#fallen td.title { background:#e6a850; } 
#turn td.title { background:#ebd870; } 
#growth td.title { background:#6ab065; } 
#bin td.title a { color:#182c2e; font-size:13px;} 
#fallen td.title a { color:#352713; font-size:13px;} 
#turn td.title a { color:#37321a; font-size:13px; } 
#growth td.title a { color:#233d21; font-size:13px;} 
hr { border:2px dotted #ccc; border-bottom:none; } 
#tooltip { position:absolute; z-index:3000; border:1px solid #111; background-color:#eee; padding:5px; } 
#tooltip h3, #tooltip div, #tooltip p { margin:0; } 
.right_para_inside { 
    border-top: 1px solid #CCC; 
    border-bottom: 1px solid #CCC; 
    padding-bottom: 7px; 
    padding-top: 7px; 
    margin-bottom: 5px; 
} 
.right_para { 
    font-size: 16px; 
    color: #999; 
} 
.right_para .right_para_inside a:hover { 
    color: #000; 
    text-decoration: none; 
}

所以我的問題是，我怎麼能有PHP自動排序表由結束日期？

想要添加另一個細節。用戶可以通過點擊標題列（這是什麼表分類器插件的用途）來使用表格。）

當我使用sortList函數時，它會根據它所假定的按關閉日期排序表，但桌子的顏色（奇數，偶數，奇數）比完全混亂。

來源

2013-11-20 dante466

要使用PHP進行排序，需要你通過你的數據庫來做到這一點，例如：'ORDER BY close_date'，這樣做會更簡單，而不是使用JS/CSS來做這件事 –

而是通過PHP添加行類，使用CSS：

tr:nth-of-type(even) { 
    background-color:#ccc; 
}

通過PHP使用CSS，而不是添加類的應該解決您的問題。

來源

2013-11-20 17:55:54

謝謝！我完全忘了CSS可以做到這一點。 @WayneWhitty – dante466

您可以使用小部件爲tablesorter插件爲您的行着色。並且已經有一個默認小工具zebra，它將類odd和even應用於行。

$("#bin").tablesorter({ 
    widgets: ['zebra'] 
});

更多在plugin documentation。

來源

2013-11-20 18:05:41 Enam

對數據庫中的foreach插入到表中的行進行排序

回答

相關問題