Wrapper for multiple Form Elements with 2-way binding

Hi there, I tried to combine multiple elements like Checkbox and Label to a wrapper, so I will only have to change the wrapper for global layout, and not every single field.

like this:

@code {
[Parameter]
public bool IsReadOnly { get; set; }
[Parameter]
public string LabelText { get; set; }
[Parameter]
public bool CheckValue { get; set; }

}

But sadly, when I do this, the 2-way binding get´s lost when I use this Wrapper component like:

<JPCoreBlaze.Components.FormElements.BlazCheckBox IsReadOnly="isReadOnly" LabelText="@Labeltext" CheckValue="@Model.CheckboxValue"></JPCoreBlaze.Components.FormElements.BlazCheckBox>

Is there any way to achieve this?

kind regards
Thomas

Hi @Thomas_Baumgartner,

I recommend checking the official Blazor databinding documentation. It shows how to support two-way data-binding with a custom component.

Hi Team,

thanks for the link. It´s working now. For everybody interested, I had to add an EventCallback for that:

@code {
    private bool _val;
    [Parameter]
    public bool IsReadOnly { get; set; }
    [Parameter]
    public string LabelText { get; set; }
    [Parameter]
    public bool CheckValue { get => _val; set
        {
            if (_val == value) return;
            _val = value;
            CheckValueChanged.InvokeAsync(value);
        }
    }
    [Parameter] public EventCallback<bool> CheckValueChanged { get; set; }