How to select a Blazor ListView item programmatically

Answer:

We can initialize ListView with any of its item in selected by adding the ‘e-active’ class to that list item element. This can be achieved using HtmlAttributes property of ListView. We have prepared a simple sample in which we have rendered ListView with default selection.

<div style="display: flex">

<h5>Without check boxh5>

<div class="margin">

<SfListView @ref="@SfList"

DataSource="@DataSource">

<ListViewFieldSettings Id="Id" Text="Text" HtmlAttributes="html">ListViewFieldSettings>

SfListView>

div>

div>

@code

{

SfListView SfList;

List DataSource = new List()

{

new ListDataModel{ Id = "1", Text = "Artwork",Checked=true },

new ListDataModel{ Id = "2", Text = "Abstract"},

new ListDataModel{ Id = "3", Text = "Modern Painting",html=new Dictionary<string, object>(){ {"class","e-active" } } },

new ListDataModel{ Id = "4", Text = "Ceramics"},

new ListDataModel{ Id = "5", Text = "Animation Art"},

new ListDataModel{ Id = "6", Text = "Oil Painting"},

};

class ListDataModel

{

public string Id { get; set; }

public string Text { get; set; }

public bool Checked { get; set; }

public Dictionary<string, object> html { get; set; }

}

}


Find the sample to select a Blazor ListView item programmatically from here.

Loader.
Up arrow icon