Kendo Grid custom command button shown dynamically

Question

I have a Custom Command button in a Kendo Grid, however its functionality is linked to the row itself. Is there any way to only show the custom command button AFTER an insert?

The grid is currently in inline edit mode, so when you click insert the custom command is shown all the time, and clicking on it produces an error since the data does not yet exist (the user hasn't clicked the update button)

See image for example :- I'm trying to have the Edit Teams, Export and Set Active button only visible after the data has been entered into the DB (ie after the update button is clicked).

Answer 1

You can handle onEdit event and disable the custom command button using jquery code.

please post your code in order to get it working.

Answer 2

I've found a way to do this using CSS only - Kendo applies the k-grid-edit-row class to any grid row thats in the editable state, Using that I can do :-

/* Hide the buttons on an edit row */
.k-grid-edit-row .k-grid-EditTeams,
.k-grid-edit-row .k-grid-Export,
.k-grid-edit-row .k-grid-SetActive {
  visibility: hidden;
}

Where k-grid-EditTeams, Export and SetActive are my button classes.