Enabling or disabling radzen components

Question

I am trying to use a RadzenDataGrid in Blazor in which each row has a edit button that toggles whether a RadzenDropDown is enabled or disabled. clicking the button updates the bound property but does not enable the RadzenDropDown. following is my code

<RadzenTabs>
    <Tabs>
        <RadzenTabsItem Text="Users">
            <RadzenDataGrid AllowFiltering="true" AllowColumnResize="true" AllowAlternatingRows="false" FilterMode="FilterMode.Advanced" AllowSorting="true" PageSize="10" AllowPaging="true" PagerHorizontalAlign="HorizontalAlign.Left" ShowPagingSummary="true"
                            Data="@_userRightsService.GetUsers()" TItem="User" ColumnWidth="300px" LogicalFilterOperator="LogicalFilterOperator.Or">
                <Columns>
                    <RadzenDataGridColumn TItem="User" Property="id" Filterable="true" Title="ID" Frozen="true" Width="80px" TextAlign="TextAlign.Center" />
                    <RadzenDataGridColumn TItem="User" Property="userName" Title="Username" Frozen="true" Width="160px" />
                    <RadzenDataGridColumn TItem="User" Title="Groups" Frozen= "true" Width="180px">
                        <Template>
                            <RadzenDropDown Disabled="@context.internal_isEditingDisabled" Value="@_userRightsService.GetGroupsForUser(context).Select(i=> i.id).AsQueryable()" TValue="int" Data="@_userRightsService.GetGroups()" TextProperty="group_name" ValueProperty="id" Multiple=true AllowClear=true Placeholder="Select groups" Chips=true Style="width: 100%; max-width: 400px;"></RadzenDropDown>
                        </Template>
                    </RadzenDataGridColumn>
                    <RadzenDataGridColumn TItem="User" Title="Actions" Frozen="true" Width="180px">
                       <Template Context="user">
                           <RadzenButton Text="Edit" Click="@((x)=> onEditButtonClicked(x, user))"></RadzenButton>
                           <RadzenButton Text="Cancel"></RadzenButton>
                       </Template>
                    </RadzenDataGridColumn>
                </Columns>
            </RadzenDataGrid>
        </RadzenTabsItem>
        <RadzenTabsItem Text="Groups">

        </RadzenTabsItem>
        <RadzenTabsItem Text="Roles">

        </RadzenTabsItem>
    </Tabs>
</RadzenTabs>


@code {

    protected override async Task OnInitializedAsync()
    {
        base.OnInitialized();
    }


    private async Task onEditButtonClicked(MouseEventArgs eventArgs, User user)
    {
        user.internal_isEditingDisabled = !user.internal_isEditingDisabled;
    }
}

However, if the RadzenDropDown is bound to a local class property, it works (but then it applies to all rows). Hoping for some help here. cheers

I have tried various combinations and have inspected objects to see that properties are indeed being updated but the controls are not enabled.

Answer 1

Try updating your onEditButtonClicked method to look like this:

private async Task onEditButtonClicked(MouseEventArgs eventArgs, User user) {
    user.internal_isEditingDisabled = !user.internal_isEditingDisabled;
    await InvokeAsync(StateHasChanged);
}