How to hide custom command buttons during inline editing

[Rajapandi Ravi]

Hi David, 

Greetings from Syncfusion support 

Based on your query you want to disable the command button while editing. Based on your requirement we have prepared a sample through the below way using the actionComplete event of the EJ2 grid. Please refer the below Code example and sample for more information. 

<div class="control-section"> 

    <ejs-grid id="Grid" actionComplete="complete" dataSource="ViewBag.dataSource" toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Cancel", "Update" })" allowPaging="true"> 

        <e-grid-pagesettings pageCount="5"></e-grid-pagesettings> 

        <e-grid-editSettings allowAdding="true" allowDeleting="true" allowEditing="true" mode="Normal"></e-grid-editSettings> 

        <e-grid-columns> 

            .  .  .  .  .  .  .  .  .  .  .  

            .  .  .  .  .  .  .  .  .  .  . 

            <e-grid-column headerText="Manage Records" width="120" commands="commands"></e-grid-column> 

        </e-grid-columns> 

    </ejs-grid> 

</div> 

 

<script> 

    function complete(args) { //actionComplete event of Grid 

        if (args.requestType == "beginEdit" || args.requestType == "add") { 

            if (args.form.querySelector('.e-unboundcell')) { 

                //disable the command buttons 

                args.form.querySelector('.e-unboundcell').querySelector("button[title='Save']").ej2_instances[0].disabled = true;  

                args.form.querySelector('.e-unboundcell').querySelector("button[title='Cancel']").ej2_instances[0].disabled = true; 

            } 

             

        } 

    } 

</script> 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/sample-1331332998.zip 

API: https://ej2.syncfusion.com/documentation/api/grid/#actioncomplete 

Screenshot: 

 

Regards, 

Rajapandi R 

[David Rose]

We have a grid with inline editing and a custom command button. 

We would like to hide or disable the custom buttons while editing. Currently, the custom buttons are always shown, even when the update & cancel are shown during an inline edit.

Thanks!

[David Rose]

Thanks, this looks good.

[Rajapandi Ravi]

Hi David, 

We are happy to hear that the provided solution was helpful to achieve your requirement.  

Please get back to us if you need further assistance. 

Regards, 

Rajapandi R