Custom Blazor Input Control Wrapper Components not updating correctly.

[adrianwright109]

Hi,

I need some help with a Blazor implementation of input controls. I am using CSLA with Telerik Blazor controls.

I have taken the standard Telerik Blazor TelerikTextBox and TelerikNumericTextBox controls and created my own custom component wrappers to those controls called CslaTextInput and CslaNumericInput.

The wrapper components have a Property [Parameter] that takes in a Csla.Blazor.IPropertyInfo from a BusinessBase model.
e.g.

Property="@(vm.GetPropertyInfo(() => vm.Model.CustomTelerikTextBox))"

Then in the wrapper the the Telerik component binds the value based on the Csla.Blazor.IPropertyInfo Value
e.g.

 @bind-Value="Value" 

[Parameter]
public IPropertyInfo Property { get; set; }

protected string Value
{
    get => (string)Property.Value;
    set => Property.Value = value;
}

Where as the standard Telerik component deals directly with the property
e.g.

@bind-Value="vm.Model.StandardTelerikTextBox"

I believe the issue I am facing (not 100% sure) is that when the Value property of the Csla.Blazor.IPropertyInfo changes the Blazor UI doesn't get notified that a change has been made and doesn't update the bound model value on screen.

The below video shows the issue on the custom control where the bound model value to the right of the control doesn't stay in sync with the input control value until a different control is changed and forces an update on screen.

If I update the model behind the scenes it works

https://drive.google.com/file/d/1Exfl0U39GU_61vCjieTp5w-TN6yx6rbp/view?usp=sharing

https://github.com/adrianwright109/CSLAInputControls

[JacoJordaan]

I suggest that you check out the PropertyInfo class: https://github.com/MarimerLLC/csla/blob/main/Source/Csla.Blazor/PropertyInfo.cs

It looks like the setter will update the model property and notify that the model property has changed, but will it also notify that the Value property has changed?

[JacoJordaan]

I also don't see the vm.ModelPropertyChanged code in your razor file to make sure StateHasChanged are called.

protected override void OnInitialized()
    {
        vm.ModelPropertyChanged += async (s, e) => await InvokeAsync(() => StateHasChanged());
    }

Not sure if this will have an impact?