php - 如何根据行号是否匹配来填充HTML表编号的行？

所以，我在本周早些时候询问了this question，@newfurnunity帮了我一把，但现在我有了一个新问题：我希望能够将设备放在这个跨度上超过一个U（因此，设备db表中的usize列）-有些设备可以跨越半个机柜。另外，我希望能够将设备标记为在机柜的前面或后面，但这应该足够简单，我可以搞清楚。
以下是仅1U设备的工作代码（请参阅数据库设置的旧问题）：

<SCRIPT LANGUAGE="JavaScript" type="text/javascript">
<!--
    function clickHandler(e)
    {
        var targetId, srcElement, targetElement;
        if (window.event) e = window.event;
        srcElement = e.srcElement? e.srcElement: e.target;
        if (srcElement.className == "Outline")
        {
                targetId = srcElement.id + "d";
                targetElement = document.getElementById(targetId);

            if (targetElement.style.display == "none")
                {
                        targetElement.style.display = "";
                        srcElement.src = "images/minus.gif";
                    }
            else
                {
                    targetElement.style.display = "none";
                    srcElement.src = "images/plus.gif";
                }
        }
    }
    document.onclick = clickHandler;
-->
</SCRIPT>
<noscript>You need Javascript enabled for this page to work correctly</noscript>
<?
function sql_conn()
{
    $username="root";
    $password="root";
    $database="racks";
    $server="localhost";

    @mysql_connect($server,$username,$password) or die("<h2 align=\"center\" class=\"red\">[<img src=\"images/critical.gif\" border=\"0\">] Unable to connect to $server [<img src=\"images/critical.gif\" border=\"0\">]</h2>");
    @mysql_select_db($database) or die("<h2 align=\"center\" class=\"red\">[<img src=\"images/critical.gif\" border=\"0\">] Unable to select $database as a database [<img src=\"images/critical.gif\" border=\"0\">]</h2>");
}

sql_conn();
$sql_datacenters="SELECT * FROM `datacenters`";
$result_datacenters=mysql_query($sql_datacenters);
$j=0;
echo "<table border='1' style='float:left;'>";
while ($datacenters_sqlrow=mysql_fetch_array($result_datacenters))
{
    echo "<tr><td>";
    echo "<h2 class='black' align='left'>";
    echo "<IMG SRC='images/plus.gif' ID='Out" . $j . "' CLASS='Outline' STYLE='cursor:hand;cursor:pointer'>"; // fancy icon for expanding-collapsing section
    echo " " . $datacenters_sqlrow['rack'] . ": " . $datacenters_sqlrow['cagenum'] . "</h2>"; // datacenter name and cage number
    echo "<div id=\"Out" . $j . "d\" style=\"display:none\">"; // opening of div box for section that is to be expanded-collapsed
    echo $datacenters_sqlrow['notes'] . "<br /><br />"; // datacenter notes
    $sql_cabinets="SELECT * FROM `cabinets` WHERE `datacenter` = '$datacenters_sqlrow[0]' ORDER BY `cabinetnumber` ASC";
    $result_cabinets=mysql_query($sql_cabinets);
    while ($cabinets_sqlrow=mysql_fetch_array($result_cabinets))
    {
        $sql_devices="SELECT * FROM `devices` WHERE `datacenter` = '$datacenters_sqlrow[0]' AND `cabinet` = '$cabinets_sqlrow[1]' ORDER BY `ustartlocation` ASC";
        $result_devices=mysql_query($sql_devices);
        echo "<table border='1' style='float:left;'>"; // opening of table for all cabinets in datacenter
        echo "<tr><td colspan='2' align='middle'>" . $cabinets_sqlrow[1] . "</td></tr>"; // cabinet number, spans U column and device name column
        $devices = array();
        while($row = mysql_fetch_array($result_devices)) {
            $devices[$row['ustartlocation']] = $row['devicename'];
        }
        for ($i = 0; $i < $cabinets_sqlrow[2]; $i++) // iterates through number of U in cabinet
        {
            $u = $cabinets_sqlrow[2] - $i; // subtracts current $i value from number of U in cabinet since cabinets start their numbers from the bottom up
            echo "<tr>";
            echo "<td width='15px' align='right'>$u</td>"; // U number
            echo (isset($devices[$u]) ? "<td width='150px' align='middle'>$devices[$u]</td>" : "<td width='150px' align='middle'>empty</td>");
            echo "</tr>";
        }
        echo "</table>"; // closes table opened earlier
    }
    echo "</td></tr>";
    echo "</div>"; // close for div box that needs expanding-collapsing by fancy java
    $j++; // iteration for the fancy java expand-collapse
}
echo "</table>";
mysql_close();
?>

最佳答案

基于您之前的问题，每个ustartlocation都是唯一的（因此您可以将其用作$devices数组中的索引）。使用相同的概念，您可以将$devices数组从“ustartlocation填充到(ustartlocation + (usize - 1))”。

$devices = array();
while($row = mysql_fetch_array($result_devices)) {
    $endLocation = ($row['ustartlocation'] + ($row['usize'] - 1));
    for ($location = $row['ustartlocation']; $location <= $endLocation; $location++) {
        $devices[$location] = $row['devicename'];
    }
}

因为显示循环已经遍历每个U并显示分配的设备，所以不需要修改任何其他部分。但是，需要注意的是，设备名称将对每个U重复，而不是跨越它。为了跨越这段时间，我们需要做更多的工作。
首先，我们可以将usize存储在$devices数组中，而不是填充每个单独的位置。此外，为了防止以后进行大量额外的工作/计算，我们还将为每个附加位置存储一个“占位符”设备。

while($row = mysql_fetch_array($result_devices)) {
    // get the "top" location for the current device
    $topLocation = ($row['ustartlocation'] + $row['usize'] - 1);

    // populate the real position
    $devices[$topLocation] = $row;

    // generate a list of "placeholder" positions
    for ($location = ($topLocation - 1); $location >= $row['ustartlocation']; $location--) {
        $devices[$location] = 'placeholder';
    }
}

接下来，在显示循环中，您将检查当前位置是否是占位符（如果是，则只显示U，不对设备执行任何操作；如果不是，则显示设备或“空”）。为了实现每个设备的“跨度”效果，我们将设置单元格的rowspan等于设备的usize。如果它是1，它将是一个单元格；2，它将跨越2行等（这就是为什么占位符行上的设备“不做任何事情”将起作用）：

for ($i = 0; $i < $cabinets_sqlrow[2]; $i++) {
    $u = $cabinets_sqlrow[2] - $i;
    echo "<tr>";
    echo '<td width="15px" align="right">' . $u . '</td>';
    if (isset($devices[$u])) {
        // we have a "device" here; if it's a "placeholder", do nothing!
        if ($devices[$u] != 'placeholder') {
            echo '<td width="150px" align="middle" rowspan="' . $devices[$u]['usize'] . '">' . $devices[$u]['devicename'] . '</td>';
        }
    } else {
        echo '<td width="150px" align="middle">empty</td>';
    }
    echo "</tr>";
}

因此，正如我们所看到的，上面的第一种方法简单地为每个U重复设备，它跨越的范围要简单得多。然而，第二种方法将呈现更为用户友好的显示。这是您对要使用哪种方法以及您认为哪种方法在将来更易于维护的偏好。
更新（代码修复和多方向跨越）
我没有意识到您的表是按降序构建的，所以我将ustartlocation作为导致错误行/单元格移动的“顶部位置”。我已经修复了上面的代码，以便根据每个解决该问题的设备的ustartlocation和usize正确设置“顶部位置”。
或者，由于方向可能重要，也可能不重要，我定制了$devices-填充循环（下面），以支持创建向上或向下的行跨度，这完全取决于您指定的标志。您需要更改的唯一代码（如果您已经从上面定制了显示循环）是填充while的$devices循环：

$spanDevicesUpwards = true;
while($row = mysql_fetch_array($result_devices)) {
    if ($row['usize'] == 1) {
        $devices[$row['ustartlocation']] = $row;
    } else {
        $topLocation = ($spanDevicesUpwards ? ($row['ustartlocation'] + $row['usize'] - 1) : $row['ustartlocation']);
        $bottomLocation = ($spanDevicesUpwards ? $row['ustartlocation'] : ($row['ustartlocation'] - $row['usize'] + 1));

        $devices[$topLocation] = $row;
        for ($location = ($topLocation - 1); $location >= $bottomLocation; $location--) {
            $devices[$location] = 'placeholder';
        }
    }
}

如果usize跨越的范围超过1，则此新代码块将确定当前设备的“顶部单元格”和“底部单元格”。如果向上延伸，则顶部单元格为ustartlocation + usize - 1；如果向下延伸，则仅为ustartlocation。底部位置也以这种方式确定。

关于php - 如何根据行号是否匹配来填充HTML表编号的行？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/13219921/