disable the grid or/and functionality

[Daniel]

Hello again,
I would like to disable all the functionalities such as paging and buttons/anchors that play the role for CRUD operations.
When i click edit,i want everything on grid to be desabled,because beneath will be a editing for,and only if he press save or cancel,re-enable the grid and its functionalities.
How can i achieve this?

Regards,
Daniel

[Iliana Dyankova]

Hi Daniel,

I am afraid your scenario is not supported by Kendo UI Grid. As a possible workaround I can suggest you to attache a click handler to the edit buttons and cover the grid table with a transparent element which will prevent it from editing/paging etc. A similar scenario is explained in this forum thread.

Regards,
Iliana Nikolova
the Telerik team

[Daniel]

ok,but at least the anchor can i disable somehow?or how can i simulate an disabled anchor?

[Iliana Dyankova]

Hi Daniel,

In order to disable the Grid's pager buttons you can apply .k-state-disabled class to them. For example: 

$("#grid").kendoGrid({
   //....
   dataBound: disableButtons
});

function disableButtons(){
   setTimeout(function(){
      $(".k-grid-pager a").addClass("k-state-disabled")
   })
}

Kind regards,

Iliana Nikolova
the Telerik team

[Daniel]

ok thanks for the tip.Regarding the anchor buttons,if it is a text i can disable them with jquery $("#name_achor").attr("disabled","true") but if i do not have text,only an image,then it doesn't work.

Daniel

[Iliana Dyankova]

Hi Daniel,

Generally speaking, the disabled attribute will not work because the Grid's command buttons are links and the click event will be triggered when they are clicked. Hence in order to disable the aforementioned buttons you should prevent the click. For example: 

var grid = $("#grid").data("kendoGrid");
grid.table.on("click", ".k-grid-edit,.k-grid-delete", function () {
    return false;
});

$(".k-toolbar.k-grid-toolbar .k-grid-add").on("click", function () {
     return false;
})

Kind regards,
Iliana Nikolova
the Telerik team

[Daniel]

ok,thank you for the information.

[Daniel]

i tried your code,but it doesn't do anything,i still can click that anchor.Actually on the demo application that you sent,with this code only the built-in commands are disabled,not the custom ones.

Regards,
Daniel

[Iliana Dyankova]

Hi Daniel,

Yes, the provided code snippet works only for the built-in buttons (k-grid-edit,.k-grid-delete, .k-grid-add). If you would like to disable the custom buttons you could use a similar logic. For your convenience I updated the example and attached in back. Please note this is a possible implementation, however you could change it using different custom logic.
 
Kind regards,
Iliana Nikolova
the Telerik team

[Daniel]

I saw in the demo that there some custom buttons,and looks like they are disabled,but they are disabled from the begining.everything is disabled now.
Could you explain to me a little bit what's the ideea of the demo project,what should do?

Thank you,
Daniel

[Iliana Dyankova]

Hello Daniel,

Yes, the buttons are disabled from the beginning - this is just an example. Actually, the idea of the project is to demonstrate the suggested approach for disabling the buttons (both built-in and custom) in action. As I said in my previous post, you could try a custom implementation and disable the buttons as per your requirements. 

Regards,
Iliana Nikolova
the Telerik team

[Daniel]

So this piece of code disable the custom  button?
<script>
$(document).ready(function () {
var grid = $("#Grid").data("kendoGrid");
grid.table.on("click", ".k-grid-edit,.k-grid-delete", function () {
return false;
});

$(".k-toolbar.k-grid-toolbar .k-grid-add").on("click", function () {
return false;
})
})

Regards,
Daniel

[Daniel]

Ok,thank you.