CheckBox Column is not updated when edit mode is Dialog/Inline template

Bill Lemonis

Asked On November 19, 2019 12:15 PM UTC

Hello,

I've created an application based on your example from https://ej2.syncfusion.com/blazor/documentation/grid/editing/#dialoginline-template and I've extended with one more column of type boolean and then I tried to bind it.

I've tried the following combinations:

1. <EjsCheckBox ID="Shipped" Checked="@(Order.Shipped)" Label="Shipped"></EjsCheckBox>

2. <EjsCheckBox ID="Shipped" @bind-Checked="@(Order.Shipped)" Label="Shipped"></EjsCheckBox>

3. <EjsCheckBox ID="Shipped" Checked="@(Order.Shipped)" Label="Shipped" OnInput="@(args => Order.Shipped = (bool)args.Value)"></EjsCheckBox>

with out any success. Replacing EjsCheckBox with standard HTML "input type='checkbox'" works fine.

While I was trying different combinations, accidentally I ended up with the following code and it worked (having both html input and EjsCheckBox )!!

</div>

How I properly use EjsCheckBox when edit mode is Template (instead of using both controls)?

On the same project, I've a second grid with "Custom Binding", which it works fine except when edit mode is Dialog/inline template. When I edit a record, it shows an empty dialog.

Please help me on this, too.

Thanks a lot,

Bill

Attachment: BlazorApp2_b2c5134c.rar

Reply | Reply with quote

Renjith Singh Rajendran [Syncfusion]

Replied On November 20, 2019 12:36 PM UTC

Hi Bill,

Thanks for contacting Syncfusion support.

We suggest you to ensure to provide the “Name” attribute for the “EjsCheckBox”. We have also modified the sample to make the checkbox column get updated with the value from the “EjsCheckBox” during dialog editing in Grid. Please download the sample form the link below,

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp2_b2c5134c-1373511383

Please refer the code below,

<EjsGrid TValue="OrdersDetails" ID="Grid" ModelType="@Model" AllowSorting="true" ...>

<EjsDataManager AdaptorInstance="@typeof(CustomAdaptor)" Adaptor="Adaptors.CustomAdaptor"></EjsDataManager>

<GridPageSettings PageSize="8"></GridPageSettings>

<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="@Syncfusion.EJ2.Blazor.Grids.EditMode.Dialog">

<Template>

@{

<div>

...

...

@*OnInput="@(args => Order.Shipped = (bool)args.Value)"*@

@*<input type="checkbox" data-val="@(Order.Shipped)" id="Shipped" name="Shipped" value="@(Order.Shipped)">*@

<EjsCheckBox ID="Shipped" Name="Shipped" Checked="@(Order.Shipped)" Label="Shipped"></EjsCheckBox>

</div>

}

</Template>

</GridEditSettings>

...

</EjsGrid>

Please get back to us if you need further assistance.

Regards,

Renjith Singh Rajendran.

Reply | Reply with quote

Bill Lemonis

Replied On November 20, 2019 01:40 PM UTC

Hello,

With the "Name"attribute it works now, thanks a lot!

Could you please help me with my second question regarding the "Custom Binding"?

On the same page of my project, I have a second grid where I have placed an EjsDataManger with CustomAdaptor (example taken from https://ej2.syncfusion.com/blazor/documentation/grid/custom-binding/#custom-binding). The only difference is that I've changed the Mode to dialog/inline template.

The template and the datasource are the same used on my first grid. Now, when I try to edit a record, it shows up an empty dialog.

Thanks again,

Bill

Reply | Reply with quote

Renjith Singh Rajendran [Syncfusion]

Replied On November 21, 2019 10:37 AM UTC

Hi Bill,

We have analyzed the sample from your previous update. And in that sample you have missed to define the “ModelType” property of Grid. We suspect that, this might be the cause of the problem(Edit Dialog shows empty). So we suggest you to ensure to provide the “ModelType” property.

<EjsGrid TValue="OrdersDetails" ModelType="@Model" ... >

...

</EjsGrid>

Documentations :

https://ej2.syncfusion.com/blazor/documentation/grid/editing/#dialoginline-template

https://ej2.syncfusion.com/blazor/documentation/grid/templates/

If you are still facing difficulties, kindly share with us the following details for better assistance,

Share the video demo or screenshot of the problem you are facing.
Share the details of the script error if any occurred in the browser console.
Share the sample which you have tried from your side.

The provided information will help us analyze the problem, and provide you a solution as early as possible.

Regards,

Renjith Singh Rajendran.

Reply | Reply with quote

Bill Lemonis

Replied On November 21, 2019 10:49 AM UTC

Thanks again,

ModelType resolved the problem!

Regards,

Bill

Reply | Reply with quote

Vignesh Natarajan [Syncfusion]

Replied On November 22, 2019 03:48 AM UTC

Hi Bill,

Thanks for the acknowledgement.

We are glad to hear that your query has been resolved by our solution.

Please get back to us if you have further queries.

Regards,

Vignesh Natarajan.

Reply | Reply with quote

Thread ID:	Created:	Updated:	Platform:	Replies:
149225	Nov 19,2019 12:15 PM UTC	Nov 22,2019 03:48 AM UTC	Blazor	5

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US