RadzenCheckBoxList

Radzen.Blazor Components
1

I'm probably missing something obvious.. How can a very long CheckBoxList be contained within a panel/card/etc. with a scrollbar? In the following example the list runs beyond the card (same with panel).

<div class="rz-p-12 rz-text-align-center">
    <RadzenCard style="height:50px">
    <RadzenCheckBoxList
    Orientation="Orientation.Vertical" Data="@data" @bind-Value=@values TValue="int" TextProperty="Name" ValueProperty="Id" class="mb-5">
        <Items>
            <RadzenCheckBoxListItem Text="Static item" Value="0" />
        </Items>
    </RadzenCheckBoxList>
    </RadzenCard>
</div>

@code {
    IEnumerable<int> values = new int[] { 1 };

    public class MyObject
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

    IEnumerable<MyObject> data = new MyObject[] {
        new MyObject(){ Id = 1 , Name = "Orders"}, new MyObject() { Id = 2 , Name = "Employees"}, new MyObject() { Id = 3 , Name = "Customers" },
        new MyObject(){ Id = 1 , Name = "Orders"}, new MyObject() { Id = 2 , Name = "Employees"}, new MyObject() { Id = 3 , Name = "Customers" },
        new MyObject(){ Id = 1 , Name = "Orders"}, new MyObject() { Id = 2 , Name = "Employees"}, new MyObject() { Id = 3 , Name = "Customers" } };
}
2

Hi @Motostylus,

You can just set the overflow CSS attribute:

<RadzenCard style="height: 50px; overflow: auto">
1 Like