bitfoundation/bitplatform

Bit.BlazorUI.BitTextField does not support changing the EditContext dynamically

Closed this issue · 4 comments

mrj02 commented

Is there an existing issue for this?

  • I have searched the existing issues

Describe the bug

Hello, have a good time
When I use bit components in EditForm, I get this error.
Similar to the examples in the document, I used the editform.

I also used EditContext and this error is still there.

@page "/account/user-info"
@inject IUserRepository userRepo
@inject IUserAuthService authService
@attribute [Authorize]

<div class="col-lg-9 mb-4" dir="rtl">
    <div class="profilecon">
        <h5 class="mb-4">اطلاعات کاربری</h5>
        <div class="userinfo">
            @if (userP is not null)
            {
                if (!EditActive)
                {
                    <div class="row">

                        <div class="col-md-6 mb-4">
                            <div class="userinfopost">
                                <h5 class="m-0">نام و نام خانوادگی</h5>
                                <p class="m-0 mt-3" style="color: #14334c">@userP.name @userP.family</p>
                            </div>
                        </div>
                        <div class="col-md-6 mb-4">
                            <div class="userinfopost">
                                <h5 class="m-0">کد ملی</h5>
                                <p class="m-0 mt-3" style="color: #14334c">@userP.nationalCode</p>
                            </div>
                        </div>
                        <div class="col-md-6 mb-4">
                            <div class="userinfopost">
                                <h5 class="m-0">شماره تماس</h5>
                                <p class="m-0 mt-3" style="color: #14334c">@userP.phoneNumber</p>
                            </div>
                        </div>
                        <div class="col-md-6 mb-4">
                            <div class="userinfopost">
                                <h5 class="m-0">پست الکترونیکی</h5>
                                <p class="m-0 mt-3" style="color: #14334c">@userP.email</p>
                            </div>
                        </div>
                        <div class="col-md-6 mb-4">
                            <div class="userinfopost">
                                <h5 class="m-0">تاریخ تولد</h5>
                                <p class="m-0 mt-3" style="color: #14334c">@userP.birthDay</p>

                            </div>
                        </div>

                        <div class="col-12"><div class="profiledit"><button type="submit" @onclick="()=>EditActive=true">ویرایش </button></div></div>

                    </div>
                }
                else
                {
                    <EditForm Model="body" OnValidSubmit="EditUserInfo">
                        <DataAnnotationsValidator />
                        <ValidationSummary />
                        <div class="row">

                            <div class="col-md-6 mb-4">
                                <div class="userinfopost">
                                    <BitTextField @bind-value="@body.name" Placeholder="نام"  />
                                </div>
                            </div>
                            <div class="col-md-6 mb-4">
                                <div class="userinfopost">
                                    <BitTextField @bind-value="@body.family" Placeholder="نام خانوادگی"/>
                                </div>
                            </div>
                            <div class="col-md-6 mb-4">
                                <div class="userinfopost">
                                    <BitTextField @bind-value="@body.nationalCode" Placeholder="کد ملی"/>
                                </div>
                            </div>
                           
                            <div class="col-md-6 mb-4">
                                <div class="userinfopost">
                                    <BitTextField  @bind-value="@body.email" Placeholder="پست الکترونیکی"/>
                                </div>
                            </div>
                            <div class="col-md-6 mb-4">
                                <div class="userinfopost">
                                    <BitDatePicker DateFormat="yyyy/MM/dd" @bind-value="body.birthday"
                                                   AriaLabel="@body.birthday"
                                                   Culture="CultureInfoHelper.GetFaIrCultureByFarsiNames()"
                                                   MaxDate="DateTimeOffset.Now.AddYears(-10)" ShowGoToToday="false"
                                                   MinDate="DateTimeOffset.Now.AddYears(-80)" 
                                                   Style="max-width: 250px;">
                                    </BitDatePicker>
                                </div>
                            </div>

                            <div class="col-12"><div class="profiledit"><BitButton ButtonType="BitButtonType.Submit">ثبت </BitButton></div></div>

                        </div>
                    </EditForm>
                }

            }
            else
            {
                <div class="d-flex justify-content-center" style="margin-top: 25%;">
                    <div class="lds-roller"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div>
                </div>
            }

        </div>
    </div>
</div>

@code {
    [CascadingParameter]
    public MainLayout Layout { get; set; }
    private UserPersonal userP = new();
    private bool EditActive = false;
    private BodyManageUser body;

    protected override async Task OnInitializedAsync()
    {
        await GetUserInformation();
        body = new BodyManageUser()
            {
                name = userP.name ?? "",
                family = userP.family ?? "",
                email = userP.email ?? "",
                nationalCode = userP.nationalCode ?? "",
                birthday = userP.birthDay ?? "",
                userName = userP.phoneNumber ?? ""

            };
    }
    protected async Task GetUserInformation()
    {
        if (await authService.CheckToken())
        {
            var res = await userRepo.GetUserInfo();
            if (res.IsSuccess)
            {
                userP = res.Response;
            }
            else
            {
                await Layout.Snack.Show("خطایی رخ داده است", "", BitSnackBarType.Error);
            }
        }
        else
        {
            await Layout.Snack.Show("لطفا دوباره وارد شوید", "", BitSnackBarType.Info);
        }
    }
    protected async Task EditUserInfo()
    {
        if (await authService.CheckToken())
        {
                var res = await userRepo.ManageExtraUserInfo(body);
                if (res)
                {
                await Layout.Snack.Show("با موفقیت ویرایش شد", "", BitSnackBarType.Success);
                    EditActive = false;
                    await GetUserInformation();
                    StateHasChanged();
                }
                else
                {
                await Layout.Snack.Show("خطایی رخ داده است", "", BitSnackBarType.Error);
                }
        }
        else
        {
            await Layout.Snack.Show("لطفا دوباره وارد شوید", "", BitSnackBarType.Info);
        }

    }

}

Expected Behavior

No response

Steps To Reproduce

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: EditForm requires either a Model parameter, or an EditContext parameter, please provide one of these.
System.InvalidOperationException: EditForm requires either a Model parameter, or an EditContext parameter, please provide one of these.
at Microsoft.AspNetCore.Components.Forms.EditForm.OnParametersSet()
at Microsoft.AspNetCore.Components.ComponentBase.CallOnParametersSetAsync()
at Microsoft.AspNetCore.Components.ComponentBase.SetParametersAsync(ParameterView parameters)
at Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters(ParameterView directAndCascadingParameters)

crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100]
Unhandled exception rendering component: Bit.BlazorUI.BitDatePicker does not support changing the EditContext dynamically.
System.InvalidOperationException: Bit.BlazorUI.BitDatePicker does not support changing the EditContext dynamically.
at Bit.BlazorUI.BitInputBase1[[System.Nullable1[[System.DateTimeOffset, System.Private.CoreLib, Version=7.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]], System.Private.CoreLib, Version=7.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]].SetParametersAsync(ParameterView parameters)
at Bit.BlazorUI.BitDatePicker.SetParametersAsync(ParameterView parameters)
at Microsoft.AspNetCore.Components.Rendering.ComponentState.SupplyCombinedParameters(ParameterView directAndCascadingParameters)

Exceptions (if any)

No response

.NET Version

.net 7

Anything else?

No response

msynk commented

Thanks for contacting us. We're investigating this issue.
We'll let you know if it's possible to work on this issue or not.

msynk commented

@mrj02
The code you provided is missing some types and can't be tested properly.
It would be a great help for us If you could provide these missing Types (such as UserPersonal & BodyManageUser) or prepare a repo demostrating the issue.

msynk commented

After further investigation it is clear now that the issue is coming from mispelling the 'Value' parameter for binding the TextFields and DatePicker. the parameter starts with a captical V and not the non-capital v that you've submitted in your code here:
image
it should be @bind-Value

msynk commented

since there has been no activity for a long time, I'm closing this issue.