Switch off / on Kendo UI grid editable mode

Question

I am using a Kendo grid where grid's editable option needs to be switched on / off based some flag. Can somebody help that how can it be achieved.

     <button class="change-mode">Change Edit Mode</button>

     $('.change-mode').click(function(){
          //Swit ched on /off here  based on  some flag      
          //console.log($("#grid"));
         $("#grid").options.editable = false;    
     });

Here is the jsfiddle

Answer 1

Use edit function and global variable to disable and enable edit mode

some thing like below

var globFlag=true;

$("#grid").kendoGrid({

  ...

  edit:  function(e) {
            if ( globFlag ) {
               this.closeCell();
            }
        }

  ...

});


$('.change-mode').click(function(){
          if(globFlag)
               globFlag=false;
          else
               globFlag=true;

 });

Answer 2

If you are using the latest release of KendoUI (2014 Q3) you cannot change options directly but you can use setOptions.

<button class="change-mode">Change Edit Mode</button>

$('.change-mode').click(function(){
    //Swit ched on /off here  based on  some flag 
    var grid = $("#grid").data("kendoGrid");
    var enabled = grid.options.editable !== false;
    grid.setOptions({editable: !enabled}); 
});

Your JSFiddle modified here: http://jsfiddle.net/OnaBai/mnmm1bqw/4/