How to apply value change event in checkbox.

Question

Hello team,Can you provide an example of change value event in checkbox column. just like in text box or combobox (). // What should I put here? Best Regards,Tyrone

Vignesh Natarajan · Answer

Hi Tyrone,  
 
Thanks for contacting Syncfusion support  
 
Query: “Can you provide an example of change value event in checkbox column. just like in text box or combobox ().” 
 
From your query we understand that you want an event to trigger while changing the value of Checkbox column in Grid. We would like to inform you that while changing the value of checkbox, record will be selected and RowSelected event will be triggered. So if you want to perform some action while selecting a record. We suggest you to achieve your requirement using RowSelected / RowSelecting event of the Grid.  
 
Or if you want value change event of Grid to be triggered, then we would like to inform you that it is not possible to achieve your requirement using default checkbox column feature of Grid. We suggest you to render SfCheckBox component using ColumnTemplate feature of the Grid.  
 
Please get back to us with more details about your requirement, if you have further queries.  
 
Regards, 
Vignesh Natarajan

Tyrone · Answer

Hi Vignesh, Thanks so much for the immediate reply..can you provide me a sample or documentation links for this?

1) We suggest you to achieve your requirement using RowSelected / RowSelecting event of the Grid.2)  Render SfCheckBox component using ColumnTemplate feature of the Grid

Best Regards, Tyrone

Tyrone · Answer

Hi Vingesh,I just found this code at your site.. Can we edit and Apply value change here.. if Yes, How? Field=@nameof(Order.Verified)            HeaderText="Verified"            Type="ColumnType.Boolean"            EditType="EditType.BooleanEdit"            TextAlign="TextAlign.Center"            DisplayAsCheckBox="true"            Width="120">Best Regards,Tyrone

Vignesh Natarajan · Answer

Hi Tyrone,  

Thanks for the update.  

Before proceeding further  with your requirement, we need some more details about your requirement. So kindly share the following details.  


Do you want to have a checkbox column (used for row selection) or a Boolean column (displayed as checkbox based on boolean value in datasurce)
Do you want to perform CRUD operation in Boolean column?
If yes, do you want to change the status of checkbox directly without going into Edit mode?
Share more details about your requirement. 

Above requested details will be very helpful for us to understand your requirement and provide a better solution as early as possible.  

Regards, 
Vignesh Natarajan

Tyrone · Answer

Hi VingeshDo you want to have a checkbox column (used for row selection) or a Boolean column (displayed as checkbox based on boolean value in datasurce)          Answer: Both, Need multiple checking      2. Do you want to perform CRUD operation in Boolean column?

Answer: Just for viewing. no need to save the boolean column.. It will only save the other columns                               (values) of the checked Row. Example, Sales Order, AmountPaid and balance. Check box                                    column  (included) will indicate as selected if it is already added in the database. I'm using                              storedproc and EFCOre... please see number 4 for mre info.         3. If yes, do you want to change the status of checkbox directly without going into Edit mode?          Answer: I'm using storedprocedure to view the data included the checkbox column (include) upon                            onInititialize. must have edit option afterwards//                          Besides selection. there must also a valuchange event. For example, If I Checked the include                            checkbox.. Amount paid Column will be equals to balance column and balance column                                      will become 0. Vice versa upon uncheck.4.Share more details about your requirement.           My transaction Module is Customer payments.. It will display the list of sales order correspondin                   with customer .. Payment Row  will added in the payment table when I check the the row and save .,             Existed Payment will indicate as checked upon viewing  of transaction (Oninitialize)   Regards, Tyrone

Vignesh Natarajan · Answer

Hi Tyrone, Thanks for sharing the requested details. Query: “Besides selection. there must also a valuchange event. For example, If I Checked the include checkbox..” && “Existed Payment will indicate as checked upon viewing of transaction (Oninitialize)” We have analyzed your query and we have achieved your requirement using RowSelected, DataBound event of Grid. RowSelected event will be triggered when record is selected. DataBound event will be triggered when data is loaded onto the Grid. So while changing the checkbox value, we suggest you to perform you action in RowSelected event. Similarly during the initialize, we suggest you to select the record based on payment using SelectRowsAsync method. Refer the below code example. @code{ public SfGrid GridInstance { get; set; } public List Orders { get; set; } public bool IsInitial { get; set; } public async Task DataBoundHandler() { var selected = new List(); var paid_list = Orders.Where(x => x.AmtPaid > 0).ToList(); foreach (var list in paid_list) { var index = Orders.IndexOf(list); if (!selected.Contains(index)) { selected.Add(index); } } IsInitial = true; await GridInstance.SelectRowsAsync(selected.ToArray()); IsInitial = false; } public void RowSelected(RowSelectEventArgs Args) { if (!IsInitial) { //this event will be selected when mrecord is selected in Grid Order ord = Orders.Find(x => x.OrderID == Args.Data.OrderID); ord.AmtPaid = ord.Balance; ord.Balance = 0; GridInstance.Refresh(); } } Kindly refer the below sample for your reference Sample: https://www.syncfusion.com/downloads/support/forum/169570/ze/DataGrid_Server-917554073.zip Refer our Ug documentation for your reference https://blazor.syncfusion.com/documentation/datagrid/events#databound https://blazor.syncfusion.com/documentation/datagrid/events#rowselected Please get back to us if you have further queries or if above solution does not resolve your query. Regards, Vignesh Natarajan

Tyrone · Answer

Thanks

Vignesh, I'll give it a try.

Vignesh Natarajan · Answer

Hi Tyrone,  

Thanks for the update.  

Kindly validate the provided solution at your end and get back to us if you have further queries.  

Regards, 
Vignesh Natarajan