DataGrid Edit dialog strange behavior

Hi there


I run into a problem with the Syncfusion DataGrid:

I am using data manager with url adaptor and FluentValidation.

In my project I need to show/hide columns in edit dialog depending on selected option.

When I am adding new item columns hide and show like they should but when I am editing record nothing happens and validation is not working.

Also when I am in debugging mode I can see that on adding compiler goes through template code every time change happens in dialog but on editing it does not go through template code.

I tried fixing my problem with prevent render(OnActionComplete) but that do not fix my validation issues.

I prepared sample of code that I am using.


Attachment: TestApp_b72ab9b5.7z

8 Replies

FI Filip May 12, 2022 09:04 AM UTC

Here is a video of strange behavior.


Attachment: Video_d266c363.7z


SP Sarveswaran Palani Syncfusion Team May 13, 2022 12:27 PM UTC

Hi Filip,


Greetings from Syncfusion Support.


Query: " When I am adding new item columns hide and show like they should but when I am editing record nothing happens and validation is not working "


We are able to reproduce the reported issue at our end and we are validating the issue further and we will update the further details within two business days (May 17, 2022). Until then we appreciate your patience.


Regards,

Sarveswaran PK



SP Sarveswaran Palani Syncfusion Team May 17, 2022 12:59 PM UTC

Hi Filip,


Sorry for the inconvenience.


We are facing some complexities while checking the reported case. Currently, we are checking this with high priority, and we will update the further details within two business days. Until then we appreciate your patience.


Regards,

Sarveswaran PK



SP Sarveswaran Palani Syncfusion Team May 23, 2022 01:30 PM UTC

Hi Filip,


Sorry for the inconvenience.


Again, We are facing some difficulties while validating the issue. Currently, we are checking this with high priority, and we will update the further details within two business days. Until then we appreciate your patience.


Regards,

Sarveswaran PK



SP Sarveswaran Palani Syncfusion Team May 25, 2022 01:33 PM UTC

Hi filip,


Thanks for contacting Syncfusion Support.


I apologise for the delay. We thoroughly examined your query and discovered that the Data annotation validation property [Required] is not used, that's why validation is not performed properly in edit Operation. So, use that attribute in user.cs folder to validate. Please refer the code snippet for your reference.


User.cs

 

using System.ComponentModel.DataAnnotations;

    namespace TestApp.Data

    {

        public class User

        {

            public Guid? Id { get; set; }

            [Required]

            public string? UserName { get; set; }

            public bool IsActive { get; set; } = true;

        }

    }

 


If you have any further queries, please get back to us


Regards,

Sarveswaran PK



FI Filip May 27, 2022 08:34 AM UTC

Hi there,

Data annotation validation property [Required] is not a solution because the text box does not show/hide in the edit dialog depending on the changed value of the check box. Also, validation is still not working because it is not displaying the message set in the UserValidator class but the two messages shown in the attached picture, which is wrong.Wrong validation.PNG



SP Sarveswaran Palani Syncfusion Team May 30, 2022 05:50 PM UTC

Hi Filip,


Thanks for contacting Syncfusion Support.


We have analyzed your query an also facing same issue at our end. Currently, we are checking this with high priority, and we will update the further details within two business days. Until then we appreciate your patience.


Regards,

Sarveswaran PK



VN Vignesh Natarajan Syncfusion Team June 6, 2022 05:24 PM UTC

Hi Filip,


We regret the inconvenience caused.


We have analyzed the reported issue in the provided sample and found that you have accessed the original datasource value inside the Template rendering instead of the Context value being passed an argument. Refer to the below-modified code example.


<SfGrid @ref="UserGrid" ID="UserGrid" TValue="User" Toolbar=@(new List<object>() {"Add"})>

    <SfDataManager Adaptor="Adaptors.UrlAdaptor" Key="@nameof(User.Id)"

                   Url="@GetDataUrl" UpdateUrl="@ModifyRecordUrl">

    </SfDataManager>

    <GridEditSettings AllowAdding="true" AllowEditing="true" Mode="EditMode.Dialog">

        <Validator>

            <FluentValidationValidator />

        </Validator>

        <Template>

            @{

                var UserOrder = context as User;

                @if (UserOrder.IsActive)

                {

                    <SfTextBox @bind-Value="@(UserOrder.UserName)"></SfTextBox>

                    <ValidationMessage For="@(() => UserOrder.UserName)"></ValidationMessage>

                }

                <SfCheckBox @bind-Checked="@(UserOrder.IsActive)" TChecked="bool" ValueChange="OnChange"></SfCheckBox>

            }

        </Template>

    </GridEditSettings>

    <GridEvents TValue="User" OnActionBegin="OnActionBegin" OnActionComplete="ActionCompleteHandler">

    </GridEvents>

 

    <GridColumns>

        <GridColumn Field=@nameof(User.Id) HeaderText="ID" IsPrimaryKey=true Visible="false"></GridColumn>

        <GridColumn Field=@nameof(User.UserName) HeaderText="Korisničko ime" Width="120"></GridColumn>

        <GridColumn Field=@nameof(User.IsActive) HeaderText="Aktivan" DisplayAsCheckBox="true" Width="70"></GridColumn>

        <GridColumn Width="70">

            <GridCommandColumns>

                <GridCommandColumn Type="CommandButtonType.Edit" ButtonOption="@(new CommandButtonOptions())" ID="editBtn"></GridCommandColumn>

            </GridCommandColumns>

        </GridColumn>

    </GridColumns>

</SfGrid>

 

 

 

@code {

    User model;

    SfGrid<User> UserGrid;

 

    string BaseUrl => "/api/user/";

    string GetDataUrl => $"{BaseUrl}GetData";

    string ModifyRecordUrl => $"{BaseUrl}ModifyRecord";

 

    protected override async Task OnInitializedAsync()

    {

        await base.OnInitializedAsync();

    }

    public void OnChange(Syncfusion.Blazor.Buttons.ChangeEventArgs<bool> args)

    {

        UserGrid.PreventRender(false);

    }

    public async void OnActionBegin(ActionEventArgs<User> args)

    {

        if (args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Add) || args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.BeginEdit))

        {

            model = args.RowData;

        }

    }


Kindly refer to the modified sample below


Please get back to us if you have further queries.


Regards,

Vignesh Natarajan


Attachment: TestApp_86db55e9.zip

Loader.
Up arrow icon