Disable row based on property

Question

Hi,I have a grid that has a drop down field where the user can select from 3 values (A, B, C).How do I enable this feature:When the user selects option C;A dialog should appear asking the user for a confirmation;If the user clicks 'Yes';Disable editing for that row;Is this possible?Thanks in advance.Kind regards,Preveen

Renjith Singh Rajendran · Accepted Answer

Hi Preveen,

Thanks for your update.

Based on your scenario, we suggest you to use OnActionBegin event of Grid. In this event handler, based on the CanEdit and RequestType as BeginEdit we suggest you to disable editing using args.Cancel. And based on RequestType as Save enable the visibility for Dialog. We are attaching a modified sample for your convenience, please download the sample form the link below,

Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/DataGrid-1068362397

Please refer the codes below,

<GridEvents OnActionBegin="OnActionBegin" TValue="Order"></GridEvents>

public void OnActionBegin(ActionEventArgs<Order> args)

{

if(args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.BeginEdit) && args.Data.CanEdit == "C")

{

args.Cancel = true;

}

if(args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Save) && args.Data.CanEdit == "C")

{

IsVisible = true;

}

Reference : https://blazor.syncfusion.com/documentation/datagrid/events/#onactionbegin

Please get back to us if you need further assistance.

Regards,

Renjith Singh Rajendran

Vignesh Natarajan · Answer

Hi Preveen,  

Thanks for contacting Syncfusion support.  

Query: “Disable Row based on a property” 

Yes, we can disable a record from editing based on a property in record using OnActionBegin event. But we have analyzed your query and we are quite unclear about your requirement, so kindly share the following details.  


Kindly confirm whether the dropdownlist control is rendered outside the Grid or inside the Grid column?
If the DropDownList control is rendered in Grid, how it is render (i.e.) render in Grid column using Column template or while editing a record. 
If the dropdownlist is rendered while editing a record, then do you want to cancel the editing and cancel the changes?
Share more details about your requirement. 

Above requested details will be helpful for us to validate the reported query at our end and provide solution as early as possible.  

Regards, 
Vignesh Natarajan

Preveen · Answer

Hi,The drop down is part of the grid column.The data source is from a local List<string>I want a confirmation to appear when the user selects a certain value from the drop down and hits the save/update button. At the same time the entire row should be locked from editing so the user can't change the data in the row.

Vignesh Natarajan · Answer

Hi Preveen, As per your requirement we have prepared a sample to show a confirmation dialog to cancel the editing while selecting a C option from DropDownList control in Grid edit mode. We have achieve your requirement using EditTemplate feature of Grid to render DropDownList with ValueChange event to cancel the edit operation in Grid using CloseEdit() method. Refer the below code example. Are you sure you want to disable the editing @code{ SfGrid Grid { get; set; } public List Orders { get; set; } public List Cust = new List() { "A", "B", "C" }; private void CloseDialog() { this.IsVisible = false; // to clse the confirmation dialog. Grid.CloseEdit(); // to cancel the editing in Grid } public void OnChange(ChangeEventArgs Args) { if(Args.Value == "C") { IsVisible = true; // to show the confirmation dialog. } } private bool IsVisible { get; set; } = false; Kindly download the sample prepared using above solution from below Sample: https://www.syncfusion.com/downloads/support/forum/159730/ze/DataGrid-885133658 Refer our UG and API documentation for your reference https://blazor.syncfusion.com/documentation/datagrid/editing/#cell-edit-template https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_CloseEdit Please get back to us if you have further queries. Regards, Vignesh Natarajan

Preveen · Answer

Hi,I don't want the dialog to appear when the user chooses C.I have the grid's mode set to: EditMode.DialogWhen the user click's on the Save button, that's when the dialog should appear (assuming the user chose option C)Also, in the sample code the row's editing is not disabled, I can still edit after I choose option C.

Preveen · Answer

Hi,How do I set the CanEdit property to "C" only if the user clicks on the "YES" button of the dialog.If they close the dialog, the property shouldn't be set. Only if they hit the YES button should the property be set.

Vignesh Natarajan · Answer

Hi Preveen,  
 
Query:” How do I set the CanEdit property to "C" only if the user clicks on the "YES" button of the dialog.” 
 
We have achieved your requirement to disable the record by changing the CanEdit value to C once the edit operation is completed and Yes button is clicked from a dialog. Please find the sample from below  
 
Sample: https://www.syncfusion.com/downloads/support/forum/159730/ze/DataGrid1629698991  
 
We have used FooterTemplate of GridEditSettings to customize the actions needs to be performed once dialog is saved. Refer our API documentation for your reference 
 
https://blazor.syncfusion.com/documentation/datagrid/editing/#customize-the-edit-dialog  
https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_CloseEdit  
https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Grids.SfGrid-1.html#Syncfusion_Blazor_Grids_SfGrid_1_EndEdit  
 
Please get back to us if you have further queries.  
 
Regards, 
Vignesh Natarajan

Preveen · Answer

Hi,Thanks for the reply.I'm attaching a video with the issue.When 'Save' is clicked the value is already saved.So regardless if I click 'Yes' or 'No' the C value is saved and I can no longer edit the record.Attachment: 20201124_220327_a37a52f3.7z

Vignesh Natarajan · Answer

Hi Preveen,  
 
Thanks for the update. 
 
Query: “So regardless if I click 'Yes' or 'No' the C value is saved and I can no longer edit the record.” 
  
We have modified the sample to update the changes only on clicking the Yes button in new dialog. Refer the below code example for your reference. 
 




public void Save() 
   { 
       Grid.CloseEdit(); // to close the editform 
       IsVisible = true; 
   } 
 private void CloseDialog(string val)    {        this.IsVisible = false; // to clse the confirmation dialog.         if (val == "Yes")        {            CurrentEditedRecd.CanEdit = "C";            Grid.UpdateRow(0, CurrentEditedRecd); // to update the current edited records, value        }     }    public void OnActionBegin(ActionEventArgs<Order> args)    {        if (args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.BeginEdit) && args.Data.CanEdit == "C")        {            args.Cancel = true;        }        if (args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Save) || args.RequestType.Equals(Syncfusion.Blazor.Grids.Action.Cancel))        {            CurrentEditedRecd = args.Data;        }    }
 
 
Please find the modified sample from below  
 
Sample: https://www.syncfusion.com/downloads/support/forum/159730/ze/DataGrid-938606184  
 
Please get back to us if you have further queries.  
 
Regards, 
Vignesh Natarajan

Preveen · Answer

Hi,When I run the latest example, even if I choose A or B, the confirmation dialog is still displayed. Pressing 'Yes' causes the 'C' value to be saved in the row.Can you confirm if you also get this output?

Vignesh Natarajan · Answer

Hi Preveen,

Sorry for the inconvenience caused.

Query: “Can you confirm if you also get this output?”

Yes. We are able to reproduce the reported behavior at our end also. Now we have prevented confirmation dialog from showing while selecting a A or B option from dropdownlist. Refer the below code example.

<SfGrid @ref="Grid" DataSource="@Orders" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" Height="315">

. .

<GridColumns>

<GridColumn Field=@nameof(Order.CanEdit) HeaderText="Customer Name" Width="150">

<EditTemplate>

<SfDropDownList @ref="DDL" ID="CanEdit" TItem="string" TValue="string" @bind-Value="@((context as Order).CanEdit)" DataSource="@Cust">

</SfDropDownList>

</EditTemplate>

</GridColumn>

…. .

</GridColumns>

</SfGrid>

@code{

SfGrid<Order> Grid { get; set; }

public List<Order> Orders { get; set; }

public Order CurrentEditedRecd { get; set; }

SfDropDownList<string, string> DDL { get; set; }

public List<string> Cust = new List<string>() { "A", "B", "C" };

public void Close()

{

Grid.CloseEdit(); // to cancel the editing

}

public void Save()

{

if (DDL.Value == "C")

{

Grid.CloseEdit(); // to close the edit form

IsVisible = true; // to display the confirmation dialog

}

else

{

Grid.EndEdit(); // to save the changes in grid when value is A or B

}

Now, selecting a value A or B will not display confirmation dialog and values will be saved directly in Grid. When C value is chosen and Save button is clicked. Confirmation dialog will be shown and based on selected value. Values will be updated.

Kindly downloaded the updated sample from below

Sample: https://www.syncfusion.com/downloads/support/forum/159730/ze/DataGrid-1090105813

Please get back to us with more details if you have further queries.

Regards,

Vignesh Natarajan