нужно напечатать список из 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>

Любая помощь приветствуется, чтобы получить список альфа по вертикали.

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

Вот что у меня сработало. Обратите внимание, что столбцы сбрасываются на основе rowCount после его обнаружения в строке, которую я пометил (// Добавленная строка). Вы можете видеть, что я использую 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 (столбцы), поэтому мой макет отображается следующим образом (мой клиент определяет ширину).

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;
    } 

Answer 4

В заголовке указано 5 столбцов, но в вашем примере показано 3. Я предполагаю, что 3.

После сохранения ваших данных в массиве и их сортировки выполните следующее:3 столбца, вы хотите положение 0,3,6 в одном ряду.Следующая строка будет иметь приращение в 1 из каждого из этих значений.Итак, 1,4,7.Следующая строка будет 2,5,8.

Таким образом, вы можете изменить цикл for, чтобы он изначально содержал 3 значения.0,3,6, а затем увеличьте каждый и создайте следующую строку.