如何在Kendo UI Grid中控制按钮的启用状态

  • Z时代
  • 2024-01-10
  • 分类：问答

我在Kendo UI网格中有向上和向下箭头。对于网格上的第一个项目，我不想让项目向下移动（这是不可能的），对于最后一个项目，我不希望项目向上移动（也是不可能的）。如何在Kendo UI Grid中控制按钮的启用状态

我该怎么做？

$(document).ready(function() { 
    //Set URL of Rest Service 
    var loc = (location.href); 
    var url = loc.substring(0,loc.lastIndexOf("/")) + "/xpRest.xsp/xpRest1"; 
    var dataSource = new kendo.data.DataSource({ 
     transport: { 
     read: { 
     url: url, 
     type: 'GET' 
    },batch: false 
    }}); 
    dataSource.read(); 
    $("#gridIDNoScroll").kendoGrid({ 
     dataSource: dataSource, 
     pageSize: 15, 
     noRecords: true, 
     selectable : false, 
     columns : [{ 
      field : "name" 
     },{ 
      field : "strDate", 
      width : 150 
     },{ 
      field : "$10", 
      width : 150 
     },{ 
      command: [ 
        { 
        text: "&nbsp", 
        //click: moveDown, 
        imageClass: "k-icon k-i-arrow-s", 
        icon: "k-icon k-i-arrow-s", 
        title: "Up", 
        enable: false 
        }, 
        { 
        text: "&nbsp", 
        //click: moveUp, 
        imageClass: "k-icon k-i-arrow-n", 
        icon: "k-icon k-i-arrow-n" 
        } 
       ], 
       width:"90px" 
      }, 
     ]  
    });  
});

回答：

当我需要禁用按钮时，这对我有用。使用databound事件基本上改变状态，使用off删除事件处理程序，然后重写单击事件。事情是这样的：

$('.k-grid-add').addClass('k-state-disabled'); 
$('.k-header').off('click').on('click', '.k-grid-add', function (e) { 
    // add new logic here or ignore it 
});

如果你有工具栏中的多个按钮，则是这样的：

$('.k-grid-add').addClass('k-state-disabled'); 
$('a.k-grid-add').on("click", function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
});

回答：

您可以使用网格的dataBound事件的k-state-disabled CSS类应用到相应的按钮电网的第一个和最后一排。

请注意，k-state-disabled仅适用于“禁用”外观，但click事件仍会触发并执行命令功能。您可以跳过禁用按钮的行移动逻辑。

在附注上，您可以使用command name更容易地在DOM中查找按钮。例如，名称为foo的命令按钮将具有k-grid-foo的CSS类。

以上是 如何在Kendo UI Grid中控制按钮的启用状态 的全部内容， 来源链接： utcz.com/qa/258858.html

回到顶部