'Blazor: Binding values to select/dropdown when using component tag helper in a Razor page

I'm building an app with Blazor Webassembly and I'm doing all the user management related bits of the system server side. I'm using the component tag helper to enable me to use Razor components on my server side Razor pages, but I'm struggling to get my multiselect dropdown list working.

I've created a custom component (Dropdown.razor) that makes use of Radzen's dropdown component which looks like this:

@typeparam TItem

<RadzenDropDown AllowClear="true" AllowFiltering="true" FilterCaseSensitivity="Radzen.FilterCaseSensitivity.CaseInsensitive"
                Multiple="true" Placeholder="Please Select" @bind-Value="@BindValue"
                Data="@Data" TextProperty="@TextProperty" ValueProperty="Id" />

@code {

    [Parameter] public IEnumerable<int> BindValue { get; set; }

    [Parameter] public IList<TItem> Data { get; set; }

    [Parameter] public string TextProperty { get; set; }

}

and then I'm pulling that through into my Edit.cshtml Razor page like this:

<div class="form-group">
        <label>Line Manager(s)</label>
        <component type="typeof(Dropdown<UserDto>)" render-mode="ServerPrerendered" param-BindValue="@Model.Input.SelectedLineManagers"
                   param-Data="@Model.Input.LineManagers" param-TextProperty="FullName"  />
</div>

This works in that it loads the component, pulls through a list of line managers and preselects any previously selected line managers (using data I've just input directly into the database). However, when I go to post the form, Input.SelectedLineManagers is always null - i.e. it doesn't appear to be binding properly when I update the dropdown.

What am I doing wrong? Using ASP.NET Core hosted Blazor Webassembly (.net 6).

Below is the code behind by Edit.cshtml file that gets called when the form is submitted.

public async Task<IActionResult> OnPostAsync(string userId)
        {
            //code omitted for brevity
            var userManagerLinks = new List<UserManagerLink>();

            if (Input.SelectedLineManagers != null)
            {
                foreach (var item in Input.SelectedLineManagers)
                {
                    userManagerLinks.Add(new UserManagerLink
                    {
                        UserId = int.Parse(userId),
                        ManagerId = item
                    });
                }
            }

            var userSub = HttpContext.User?.FindFirstValue("Sub");
            await _unitOfWork.SaveUser(userSub);
            return RedirectToPage("Index");
        }


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source