Kendo UI with JQuery change template: to readonly or disable

Question

top was my out put Html

Then i using JQuery to change below code to disable or readonly but it didn't work!

I Try on kendo Ui with JQuery

$("#Txt_test").attr('disabled', true);

and

$("#Txt_test").prop('readonly', true);

and change class

$(".txtBox").attr('disabled', true);

I have change input type="text" same error for me. also I try

var clearAddGrid = $("#AddGrid").data('kendoGrid');
clearAddGrid.editable = false;

I want achieve like below

if(status==0)
{
    Grid input can edit
}else{
    Grid input can't edit
}

and this is my grid cells

{ field: "txtRealNum", title: "RealNum", width: "40px", template: '' },

my grid

    $("#AddGrid").kendoGrid({
        dataSource: AddGriddataSource,
        selectable: "row",
        scrollable: false,
        columns: AddGridCells,
        change: numberInput,
        pageable: {
            buttonCount: 3,
            messages: GridPageMsg
        },
        height: '100%',
        editable: true
    }).data("kendoGrid");

user_5797400 · Answer

So you want to disabled this?

Since you are using Kendo UI for jQuery, you can do this:

$("#Txt_test").addClass("k-state-disabled");

That should do it.

Thanks for the example in the Telerik DOJO. If you want to disable all the input text boxes. Add the line below after your Kendo Grid initialization.

$(".txtBox1").addClass("k-state-disabled");

For your convenience:




    
    
    
    

    
    
    
    
    
    



    
                
        
        
        
        
        
        
        
          
            no name
            U
            SNUM
            NUM
            Version
          
        
        
          11007109-2 SB 1kg*10
          1000g 818
          
            
          
          2021-06-02T15:08:00
          
          
            11094184 MS 1kg*10
            1000g
            801
            
              
              
            2021-06-03T11:24:00
          
        
      
      
        
          Go to the first page
        
        Go to the previous page
        
          1
        
          Go to the next page
        
          Go to the last page
        page1-2，total 2

user_3330947 · Answer

Make all inputs with class "txtBox" as kendo component and disable it

$(".txtBox1").kendoTextBox({
       enable: false
});

Based on upper example: Disable inputs

user_16083592 · Answer

You should change the code to this :

$("#Txt_test").attr('disabled', 'disabled');

Kendo UI with JQuery change template: <input> to readonly or disable

3 Answers