我正在尝试通过MySQL数据库填充虚拟架子类型的东西。 shelfPos
列保留该项目在货架上的位置。每行/“架子”均以<div class="shelfRow">
开头,显然以</div>
结尾,因此其样式和位置均正确。货架上的物品可以使用jQuery UI拖放式交互方式移动。
总体布局是这样的:http://jsfiddle.net/aRA5D/
每个书架可容纳5个物品(从左到右)。
我在摆架子时遇到麻烦。目前,我得到了这一点:(这代替了HTML)
<?php
$sql="SELECT * FROM shelf WHERE userID='$userID'";
$result=mysql_query($sql);
if (mysql_num_rows($result) == 0) {
// Show a message of some sort? (No items)
}
else {
$tries = 1;
$times = 10; // How many shelves. (10 = 2 shelves)
while(($row = mysql_fetch_array($result)) && ($tries <= $times)) {
while ($tries <= $times) {
if ($tries == $row['shelfPos']) {
echo '<div class="drop" id="drop'.$tries.'"><div class="boxArt" id="'.$row['gameID'].'">'.$row['gameID'].'</div></div>';
}
else {
echo '<div class="drop" id="drop'.$tries.'"></div>';
}
$tries = $tries + 1;
}
$times = $times + 5;
}
}
?>
它有几处错误。它不包含
<div class="shelfRow">
html(不知道如何/在何处放置它,因为它需要在每5个“空白”和真实项目后回显-可能是for
循环?),它需要我输入架子数(在这种情况下为2)。是否可以根据物品的位置确定需要多少个架子?这样做很尴尬,因为它还需要在它们之前和之后回显“空白” .drop
div,以便可以左右移动项目。希望这一切都有道理。谢谢您的帮助!
最佳答案
首先,您需要按ShelfPos顺序获取数据
"SELECT * FROM shelf WHERE userID='$userID' order by shelfPos asc"
并尝试以下代码:
...
$i = 0;
while($row = mysql_fetch_array($result)) {
//Each 5
if($i % 5 == 0) echo '<div class="shelfRow">';
if ($i == $row['shelfPos']) {
echo '<div class="drop" id="drop'.$i.'"><div class="boxArt" id="'.$row['gameID'].'">'.$row['gameID'].'</div></div>';
}
else {
echo '<div class="drop" id="drop'.$i.'"></div>';
}
//close shelfrow div
if($i % 5 == 4) echo '</div>';
$i++;
}
//to complete the loop
$shelv_left = 5 - ($i % 5);
if($shelv_left < 5) {
for($j=0; $j < $shelv_left; $j++) {
echo '<div class="drop" id="drop'.($i+$j).'"></div>';
}
echo '</div>'; // end shelfrow div
}
...