Question

我的剑道UI网格中有向上和向下箭头。对于网格上的第一个项目，我不希望允许项目向下移动（这是不可能的），对于最后一个项目，我不希望项目向上移动（也是不可能的）。

我该怎么做？

    $(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"  
            },
        ]       

    });       
});

Answer 1

当我需要禁用按钮时，这对我有用。使用databound事件基本上更改状态，使用off删除事件处理程序，然后覆盖click事件。像这样：

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

如果工具栏中有多个按钮，则为：

{{1}}

Answer 2

您可以使用网格的dataBound事件将k-state-disabled CSS类应用于网格的第一行和最后一行中的所需按钮。

请记住，k-state-disabled仅应用“禁用”外观，但click事件仍将触发，命令功能将执行。您可以跳过禁用按钮的行移动逻辑。

另外，您可以使用command name更轻松地在DOM中查找按钮。例如，名为foo的命令按钮的CSS类为k-grid-foo。

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

2 个答案: