Planned
Last Updated: 28 Jun 2022 22:31 by Daniel
Christian
Created on: 23 Jul 2021 14:40
Category: Form
Type: Bug Report
12
Changes in the form do not trigger model and dynamic form updates

Here is a TelerikForm with a FormItem (1) for a boolean field. Another FormItem (2) should render, depending on the boolean field (1). This does not work with a TelerikForm, but works with a standard EditForm.

The workaround for a TelerikForm is to use a FormItem Template with a TelerikCheckBox. This is demonstrated below as well.

<EditForm Model="@_data">
    <label>Condition 1 (InputCheckbox):</label>
    <InputCheckbox @bind-Value="@_data.Value1" />
    <br />
    @if (_data.Value1)
    {
        <label>Result 2</label>
        <InputCheckbox DisplayName="Result 2:" @bind-Value="@_data.Value2"></InputCheckbox>
    }
</EditForm>

<h1>TelerikForm</h1>

<TelerikForm Model="@_data">
    <FormItems>
        <FormItem LabelText="Condition 1 (FormItem):" Field="@nameof(_data.Value1)"></FormItem>
        <FormItem>
            <Template>
                <label for="x">Condition 1 (TelerikCheckBox):</label>
                <br />
                <TelerikCheckBox Id="x" @bind-Value="_data.Value1" />
            </Template>
        </FormItem>
        @if (_data.Value1)
        {
            <FormItem LabelText="Result 2:" Field="@nameof(_data.Value2)"></FormItem>
        }
    </FormItems>
</TelerikForm>

@code {
    private ExampleDto _data { get; set; } = new ExampleDto();

    public class ExampleDto
    {
        public string TextValue { get; set; }
        public bool Value1 { get; set; }
        public bool Value2 { get; set; }
    }
}

7 comments
Daniel
Posted on: 28 Jun 2022 22:31

I don't see how this is a bug, If the CheckBox triggers the bind within the TelerikForm then only the TelerikForm would re-render. I would not expect this to bubble up within Blazor. However because you have explicitly set the bind within the context of this component then I would expect a re-render to be triggered.

 

This sort of situation would occur in multiple different situations regardless of Telerik or not. The fix would be to have ExampleDto implement INotifyPropertyChanged and then whatever component you want to be affected has to subscribe to that instance. I imagine doing a InvokeAsync(StateHasChanged) would be sufficient for all nested TelerikForms to re-render and update their controls.

 

Thanks,

Daniel

Indra
Posted on: 28 Jun 2022 17:33

Same problem with textbox. This is my REPL sample.

The textbox double binding with model is not working. When we update the form, the model's value is the same

 

https://blazorrepl.telerik.com/QQaqQClB30ja2HWQ12

ADMIN
Dimo
Posted on: 17 May 2022 10:39

Hi Lee,

A "Planned" status with no specific release number usually means "in the next few months".

Regards,
Dimo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Lee
Posted on: 17 May 2022 10:28
Hi, just checking in to see the rough eta for this fix?
ADMIN
Dimo
Posted on: 25 Aug 2021 07:26

Hello Anders,

Thanks for sharing your point of view and I am sorry to find out that the workaround will cost you additional development time. I bumped the priority of this request in our backlog.

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Anders
Posted on: 25 Aug 2021 07:19

I hope this bug will get a high priority.
We're using a lot of Telerikforms around our system and if we have to use the workaround. Would set us back a week at least.

Just glad it got found

 

Regards

Anders

ADMIN
Dimo
Posted on: 23 Jul 2021 15:00

Hi Christian,

Thanks for your cooperation in detecting this problem. The bug is now confirmed and awaits prioritization for fixing in a future product version.

In the meantime, I hope the workaround with the FormItem Template with a TelerikCheckBox is a feasible option.

Regards,
Dimo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.