需要按字母顺序垂直打印 5 列列表

Question

拥有一个主要由 IE 用户查看的网页，因此 CSS3 是不可能的。

我希望它的列表如下：

A  D  G
B  E  H
C  F  I

这是当前列出的函数：

A B C
D E F
G H I

function listPhoneExtensions($group,$group_title) {
  $adldap = new adLDAP();
  $group_membership = $adldap->group_members(strtoupper($group),FALSE);

    sort($group_membership);
    print "
    <a name=\"".strtolower($group_title)."\"></a>
    <h2>".$group_title."</h2>
    <ul class=\"phone-extensions\">";
  foreach ($group_membership as $i => $username) {
      $userinfo = $adldap->user_info($username, array("givenname","sn","telephonenumber"));
      $displayname = "<span class=\"name\">".substr($userinfo[0]["sn"][0],0,9).", ".substr($userinfo[0]["givenname"][0],0,9)."</span><span class=\"ext\">".$userinfo[0]["telephonenumber"][0]."</span>";
      if($userinfo[0]["sn"][0] != "" && $userinfo[0]["givenname"][0] != "" && $userinfo[0]["telephonenumber"][0] != "") {
        print "<li>".$displayname."</li>";
      }
    }
    print "</ul><p class=\"clear-both\"><a href=\"#top\" class=\"link-to-top\">&uarr; top</a></p>";
}

渲染的 html 示例：

<ul class="phone-extensions">
<li><span class="name">Barry Bonds</span><span class="ext">8281</span></li>
<li><span class="name">Gerald Clark</span><span class="ext">8211</span></li>
<li><span class="name">Juan Dixon</span><span class="ext">8282</span></li>
<li><span class="name">Omar Ebbs</span><span class="ext">8252</span></li>
<li><span class="name">Freddie Flank</span><span class="ext">2281</span></li>
<li><span class="name">Jerry Gilmore</span><span class="ext">4231</span></li>
<li><span class="name">Kim Moore</span><span class="ext">5767</span></li>
<li><span class="name">Barry Bonds</span><span class="ext">8281</span></li>
<li><span class="name">Gerald Clark</span><span class="ext">8211</span></li>
<li><span class="name">Juan Dixon</span><span class="ext">8282</span></li>
<li><span class="name">Omar Ebbs</span><span class="ext">8252</span></li>
<li><span class="name">Freddie Flank</span><span class="ext">2281</span></li>
<li><span class="name">Jerry Gilmore</span><span class="ext">4231</span></li>
<li><span class="name">Kim Moore</span><span class="ext">5767</span></li>
<li><span class="name">Barry Bonds</span><span class="ext">8281</span></li>
<li><span class="name">Gerald Clark</span><span class="ext">8211</span></li>
<li><span class="name">Juan Dixon</span><span class="ext">8282</span></li>
<li><span class="name">Omar Ebbs</span><span class="ext">8252</span></li>
<li><span class="name">Freddie Flank</span><span class="ext">2281</span></li>
<li><span class="name">Jerry Gilmore</span><span class="ext">4231</span></li>
<li><span class="name">Kim Moore</span><span class="ext">5767</span></li>
</ul>

任何帮助都可以使其垂直列出 alpha。

Answer 1

我会将关键数据加载到一个数组中，以便您可以对它们进行计数并按您想要的任何顺序逐步执行它们。然后使用这样的算法让它们按正确的顺序排列：

$items = BuildItemArray(); // Get the values into an array.
$columnCount = 5;
$itemCount = count($items);

$rowCount = ceil($itemCount / $columnCount);
for ($i = 0; $i < $rowCount * $columnCount; $i++)
{
    $index = ($i % $columnCount) * $rowCount + floor($i / $columnCount);
    if ($index < $itemCount)
    {
        DisplayItem($items[$index]);
    }
    else
    {
        DisplayBlank();
    }
}

我认为这应该可行，但我还没有测试过。

Answer 2

我发布对这个老问题的答案是出于以下原因：

1. 我的答案更笼统，更容易让其他人适应。
2. 我不想要一个过于复杂的解决方案。
3. 我的数组是关联的，带有字符串键。顺便说一句，我的解决方案适用于关联数组和索引数组。

实际上，我想出的解决方案非常简单——在一个巨大的表格内使用多个带有 style="float:left" 的标签。虽然我怀疑在单个表中包含多个 tbody 标记能否通过 HTML 验证，但实际上它确实通过了，没有错误。

请注意，以下

• $numCols 是您所需的列数。
• 由于我们是浮动项目，您可能需要根据您的情况设置父元素的宽度和最小宽度和/或添加一些
  。
• 有关替代排序方法，请参阅 http://php.net/manual/en/array.sorting .php

这是我的完整答案：

function sortVertically( $data = array() )
{
    /* PREPARE data for printing */
    ksort( $data );     // Sort array by key.
    $numCols    = 5;    // Desired number of columns
    $numCells   = is_array($data) ? count($data) : 1 ;
    $numRows    = ceil($numCells / $numCols);
    $extraCells = $numCells % $numCols;  // Store num of tbody's with extra cell
    $i          = 0;    // iterator
    $cCell      = 0;    // num of Cells printed
    $output     = NULL; // initialize 


    /* START table printing */
    $output     .= '<div>';
    $output     .= '<table>';

    foreach( $data as $key => $value )
    {
        if( $i % $numRows === 0 )   // Start a new tbody
        {
            if( $i !== 0 )          // Close prev tbody
            {
                $extraCells--;
                if ($extraCells === 0 )
                {
                    $numRows--;     // No more tbody's with an extra cell
                    $extraCells--;  // Avoid re-reducing numRows
                }
                $output .= '</tbody>';
            }

            $output .= '<tbody style="float: left;">';
            $i = 0;                 // Reset iterator to 0
        }
        $output .= '<tr>';
            $output .= '<th>'.$key.'</th>';
            $output .= '<td>'.$value.'</td>';
        $output .= '</tr>';

        $cCell++;                   // increase cells printed count
        if($cCell == $numCells){    // last cell, close tbody
            $output .= '</tbody>';
        }

        $i++;
    }

    /* FINISH table printing */
    $output .= '</table>';
    $output .= '</div>';
    return $output;
}

我希望这个答案有一天对您有用。

Answer 3

标题显示 5 列，但您的示例显示 3 列。我假设 3。

将数据存储在数组中并对它们进行排序后，执行以下操作：

对于 3 列，您希望位置 0,3,6 位于同一行。下一行的每个值都会增加 1。所以，1,4,7。下一行将是 2、5、8。

因此，您可以将 for 循环更改为最初保存 3 个值。 0,3,6，然后递增每个，并创建下一行。

Answer 4

这对我有用。请注意，在我标记的行（//添加行）上发现行计数后，列将根据行计数进行重置。您可以看到我正在使用 screenWidth 和 itemWidth 来计算列数。

当空项数大于行数时就会出现问题。如果我有 8 列和 17 条记录，我会得到 3 行（Ceiling(17 / 8) = 3）。这是一个问题 (3 * 8) - 17 = 7 条空记录。发生的情况是这样的：

RECORD RECORD RECORD RECORD RECORD RECORD ------ ------
RECORD RECORD RECORD RECORD RECORD RECORD ------ ------
RECORD RECORD RECORD RECORD RECORD ------ ------ ------

由于行数为 3，所以我添加的代码行修复了一些问题：

columnCount = Math.Ceiling(itemCount / rowCount);

columnCount = 17 / 3 Ceiling = 6(columns)，因此我的布局呈现如下（我的客户计算出宽度）。

RECORD RECORD RECORD RECORD RECORD RECORD  
RECORD RECORD RECORD RECORD RECORD RECORD 
RECORD RECORD RECORD RECORD RECORD ------ 

希望这对遇到我的问题的人有所帮助。

    private List<CompanyCourseViewModel> Reorder(List<CompanyCourseViewModel> courses, Decimal width, Decimal itemWidth)
    {
        var list = new List<CompanyCourseViewModel>();
        var columnCount = Math.Floor(width / itemWidth);
        var itemCount = courses.Count();
        var rowCount = Math.Ceiling(itemCount / columnCount);
        columnCount = Math.Ceiling(itemCount / rowCount); // Added line.

        for (var i = 0; i < rowCount * columnCount; i++)
        {
            var index = (int) ((i%columnCount) * rowCount + Math.Floor(i/columnCount));
            if (index < itemCount)
            {
                courses[index].NumColumns = (int) columnCount;
                list.Add(courses[index]);
            }
            else 
            {
                list.Add(new CompanyCourseViewModel()
                {
                    Id = -Math.Abs(i - courses.Count()),
                    Title = "----",
                    NumColumns = (int)columnCount
                });
            }
        }

        return list;
    }