Отображение списка с несколькими столбцами

Question

В настоящее время я отображаю свой список флажков следующим образом:

foreach (var employee in Model.Employees) {        
    @Html.CheckBox(employee.Name);<br />   
}

Это замечательно, если вам нужен один длинный столбец флажков, но мой список становится длинным, поэтому я хочу отобразить его в 2 или 3 столбцах.

Есть ли простой способ сделать это? Я знаю, что могу создать таблицу, затем вставить цикл for для первой половины сотрудников для одного столбца, а затем другой цикл for для другой половины сотрудников в другом столбце. Но это кажется таким примитивным, должен быть более простой и понятный способ.

Answer 1

Я бы использовал 2 или 3 html-списка, содержащих ваши флажки, каждый список появлялся сразу после следующего в разметке, и использовал бы css для перемещения каждого списка влево.

В этом примере флажки будут разделены на 2 списка, если имеется более 10 флажков:

CSS:

.multi-list 
{
    float: left;
    padding-right: 50px;
}

.clear
{
    clear: both;
}

HTML-разметка с бритвой:

@{
    if (Model != null)
    {
        int itemCount = 0;        
        <ul class="multi-list">
            @foreach (var item in Model) {
                itemCount++;
                <li>
                    @Html.DisplayFor(modelItem => item.Name)
                    @Html.CheckBoxFor(modelItem => item.Active)
                </li>
                if (Model.Count() > 10 && itemCount == (int)(Model.Count() / 2))
                {
                    @Html.Raw("</ul><ul class=\"multi-list\">");
                }
            }
        </ul>
        <div class="clear"></div>
    }
}