顯示多列複選框列表

我目前顯示的是我的複選框列表如下：顯示多列複選框列表

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

這是偉大的，如果你想複選框的一個長列，但我的名單越來越長，所以我想要在2列或3列中顯示它。

有沒有簡單的方法來做到這一點？我知道我可以創建一個表，然後在僱員的前半部分爲一列填入for循環，然後在另一列中爲另一半僱員填入另一個for循環。但是，這看起來很原始，必須有一個更簡單，更清潔的方式。

來源

2011-07-07 Steven

我不明白如何使用2列或3列將列表縮短。你仍然會得到很多複選框水平。如果他們對分組沒有一定的邏輯意義，那麼將它們分組在列中將使得用戶不那麼直觀。 –

有一個更簡單的方法來執行此操作：http://stackoverflow.com/a/7448678/626533 – Cosmin

我會使用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> 
    } 
}

來源

2011-07-07 20:59:17 BumbleB2na

顯示多列複選框列表

回答

相關問題