How do I populate a C# Radzen dropdown with my data?

Viewed 1067

So what I am doing is querying an API that successfully returns my data. I want to let the user filter the data they see by category. Here is the C# code

@code {
    private Root alldata;
    IEnumerable<Entry> apis;
    
    protected override async Task OnInitializedAsync()
    {
        try
        {
            alldata = await Http.GetFromJsonAsync<Root>("https://api.publicapis.org/entries");
            Console.WriteLine(alldata.count);
            apis = alldata.entries;
        }
        catch (Exception ex)
        {
            Console.WriteLine(ex.Message);

        }
    }

    public class Entry
    {
        public string API { get; set; }
        public string Description { get; set; }
        public string Auth { get; set; }
        public bool HTTPS { get; set; }
        public string Cors { get; set; }
        public string Link { get; set; }
        public string Category { get; set; }
    }

    public class Root
    {
        public int count { get; set; }
        public List<Entry> entries { get; set; }
    }

    void OnChange(object value, string name)
    {
        var str = value is IEnumerable<object> ? string.Join(", ", (IEnumerable<object>)value) : value;

        Console.WriteLine($"{name} value changed to {str}");
    }

When I try to use a Radzen component to show the Categories, it remains empty. This is the Radzen Component I am trying to use:

<div class="col-lg-4 sticky-top">
            <h3>Categories</h3>
            <RadzenDropDown AllowClear="true" TValue="string" Style="width:300px"
                            Data=@(apis.Select(a => a.Category).Distinct())
                            Change=@(args => OnChange(args, "DropDown")) />

        </div>

How exactly would I go about populating this dropdown with the Categories of the APIs that the API itself is returning? And then only show the data where the category is a match?

Keep in mind the OnChange() function is one that I copied straight from the Radzen docs, I'm not 100% certain of it's purpose.

The docs for the Radzen dropdown I'm trying to use can be found here: https://blazor.radzen.com/dropdown

Thank you! :)

0 Answers
Related