How To Set The CheckBoxList Properties?

Question

I have a checkboxList with some 50 values. but I want only 5 to be displayed and navigate others using scroll bar.

I tried using

<asp:CheckBoxList CheckBoxes="true" Width="250px" Height="120px"  RepeatColumns="5" RepeatDirection="Vertical" RepeatLayout="Flow" 
                            runat="server" SelectionMode="Multiple" />

But its not coming proper.. Its coming like

[] Value1 [] value2 []val 
ue3 [] value4 .....

I want it to be

[] Value1
[] Value2 ...

Answer 1

You need to change the line Width="250px" Height="120px", to make it not so wide, then the CheckBoxes will get line-by-line, depends of the width that you've choosed. ;)

Answer 2

You would want to set the RepeatColumns to 0, as that will cause it to use the veritcal align property instead of tiling them horizontally.

---

If you would like to have them display only 5 visibily and a scroll bar to handle anything past that, you will need to set the height so that it only shows the initial 5, and then add:

overflow: auto;

To the checklistbox so that it forces anything outside of the bounding of the control to scroll. Keep in mind, the control will also need to be a block element and not inline.

Answer 3

Some how I think you just need a fixed-sized container for the checkboxlist, set its overflow style to scroll:

<div style="width:250px; height:120px; overflow:scroll;">
  <asp:CheckBoxList CheckBoxes="true" Width="250px" RepeatColumns="1" 
    RepeatDirection="Vertical" RepeatLayout="Flow" 
    runat="server" SelectionMode="Multiple" />
</div>