Jquery 如何在剑道网格中隐藏/显示ClientTemplate列

我有一个剑道网格testGrid，它有以下列：

columns.Bound(p => p.Payee);
columns.Template(@<text></text>).ClientTemplate("#if(clrCode=='1') {#<a href='javascript:GetImage()' class='k-button  k-grid-view' id='Image' title='View'>View</a>#}#").Title("Image"); 

但是，对于图像列，此代码不起作用。下面两种方法都不起作用

$("#testGrid").data("kendoGrid").showColumn("Image");
$("#testGrid thead [id=Image] .k-link").hideColumn("Image");

如果您能提供有关如何实现此功能的任何信息，我将不胜感激。

您可以使用showColumn和hideColumn方法，使用数字作为列的索引，从零开始，或者使用字符串作为列的名称。因此，在这种情况下，可以像这样显示/隐藏图像列，假设网格只有两列：

$("#testGrid").data("kendoGrid").showColumn(1);
$("#testGrid").data("kendoGrid").hideColumn(1);

可以使用showColumn和hideColumn方法，将数字作为列的索引，从零开始，或者使用字符串作为列的名称。因此，在这种情况下，可以像这样显示/隐藏图像列，假设网格只有两列：

$("#testGrid").data("kendoGrid").showColumn(1);
$("#testGrid").data("kendoGrid").hideColumn(1);

---

我能够将field属性添加到image列中，并使用show/hide列调用它

{ field: "photo", title:" ", filterable: false, sortable: false, template: kendo.template($(".column-photo-employee").html()), width: 30, locked:true }

我使用一个按钮下拉列表列出所有列名和一个图标来切换显示或隐藏，但下面是我的js代码：

var grid = $(".grid").data("kendoGrid");
var colid = ['photo','last','first','user_id','wms_id','ta_id','payroll_id','alt_id','facility','department','supervisor','shift','tg','ag','activity_id','activity_name','start','end'];

var prefix3h = 'sch3hide-';

function createCallback( a ){
    return function(){
        $('#' + prefix3h + colid[a]).toggleClass('fa-eye fa-eye-slash');
        for (var i = 0; i < grid.columns.length; i++) {
            if (grid.columns[i].field === colid[a]) {
                var col = grid.columns[i];
                if (col.hidden) {
                    grid.showColumn(col.field);
                } else {
                    grid.hideColumn(col.field);
                }
            }
        }
    }
}

for(var a = 0; a < colid.length; a++) {
    $('#' + prefix3h + colid[a]).click( createCallback( a ) );
}

colid变量是一个包含所有列名称的数组，实际上是所有列的字段属性。 较低的for循环是click事件。 createCallback函数隐藏并显示列。我必须添加第二个循环来说明列何时移动或何时被锁定/解锁

我对锁定和解锁列做了相同的操作，但只使用了lockColumn或unlockColumn

---

作为一名非程序员，我花了一段时间才弄明白这一点。发帖希望它能帮助别人。

我能够将field属性添加到image列中，并使用show/hide列调用它

{ field: "photo", title:" ", filterable: false, sortable: false, template: kendo.template($(".column-photo-employee").html()), width: 30, locked:true }

我使用一个按钮下拉列表列出所有列名和一个图标来切换显示或隐藏，但下面是我的js代码：

var grid = $(".grid").data("kendoGrid");
var colid = ['photo','last','first','user_id','wms_id','ta_id','payroll_id','alt_id','facility','department','supervisor','shift','tg','ag','activity_id','activity_name','start','end'];

var prefix3h = 'sch3hide-';

function createCallback( a ){
    return function(){
        $('#' + prefix3h + colid[a]).toggleClass('fa-eye fa-eye-slash');
        for (var i = 0; i < grid.columns.length; i++) {
            if (grid.columns[i].field === colid[a]) {
                var col = grid.columns[i];
                if (col.hidden) {
                    grid.showColumn(col.field);
                } else {
                    grid.hideColumn(col.field);
                }
            }
        }
    }
}

for(var a = 0; a < colid.length; a++) {
    $('#' + prefix3h + colid[a]).click( createCallback( a ) );
}

colid变量是一个包含所有列名称的数组，实际上是所有列的字段属性。 较低的for循环是click事件。 createCallback函数隐藏并显示列。我必须添加第二个循环来说明列何时移动或何时被锁定/解锁

我对锁定和解锁列做了相同的操作，但只使用了lockColumn或unlockColumn

---

作为一名非程序员，我花了一段时间才弄明白这一点。发帖希望对某人有所帮助。

因为没有与模板列关联的名称。他们应该在列中添加Name属性，以便您可以设置模板列的名称。感谢ataravati的澄清。因为没有与模板列关联的名称。他们应该在列中添加Name属性，以便您可以设置模板列的名称。感谢您的澄清。