Kendo UI Grid在dataBound上的客戶端模板中隱藏控件

Question

我有一個kendo網格視圖，並且使用由錨標籤和標籤組成的客戶端模板。我需要做的是在網格視圖的onDatabound事件中隱藏錨標籤。

這裏是電網

@(Html.Kendo().Grid(Model.GridView.DataSource) 
    .Name("grdRole") 
    .Columns(columns => 
      { 
       columns.Command(command => command.Edit()).Width(110); 
       columns.Bound(p => p.Code); 
       columns.Bound(p => p.Name); 
       columns.Bound(p => p.Id).ClientTemplate("<a id='lnkDisplay' href='' onclick='return linkOnClick()'> Display Data</a> <label id='lblShow'> gfhfhf</label> ").Title("Data"); 

      }) 

    .Editable(editable => editable.Mode(GridEditMode.InLine)) 
     .Events(x => 
       { 
        x.Edit("onEdit"); 
        x.Save("onSave"); 
        x.DataBound("onDataBound"); 
       }) 
     .ToolBar(toolBar => toolBar.Create()) 
    .Sortable(x => x.Enabled(false)) 
    .Scrollable(x => x.Height("auto")) 
    .Selectable(selectable => selectable.Mode(GridSelectionMode.Single)) 
    .Reorderable(reorder => reorder.Columns(true)) 
    .DataSource(dataSource => dataSource 
     .Ajax() 
     .Events(events => events.Error("error_handler")) 
     .Model(model => 
     { 
      model.Id(p => p.Id); 
      model.Field(p => p.Id).Editable(false); 
     }) 
      .Read(read => read.Action("OnGridRead", "Grid")) 
        .Create(create => create.Action("OnGridCreate", "Grid")) 
        .Update(update => update.Action("OnGridUpdate", "Grid")) 

    ) 
) 

在這裏，我所試圖做的..

function onDataBound(e) {  
     var trs = this.wrapper.find('.k-grid-content tr'); 
     trs.each(function() { 

      var id = this.childNodes[5].childNodes[0].hide(); 
     }); 
}); 

它給了我下面的錯誤..

TypeError: this.childNodes[5].firstChild.hide is not a function

Answer 1

你有做了一個混亂的選擇你的事件中的錨元素的方式。你爲什麼不簡化它（並保持jQuery而不是混合香草代碼）？

$(this.element).find('tr td a').hide() 

以上選擇將隱藏任何錨元素在你的網格，但有另一個錨元素的情況下，加入哪些元素要隱藏類，如：

.ClientTemplate("<a id='lnkDisplay' class='hide-me-at-data-bound' href='' onclick='return linkOnClick()'> Display Data</a> 

然後，只需這樣做：

$(this.element).find('.hide-me-at-data-bound').hide() 

DEMO

此外，您收到的錯誤是因爲您無法在非jQuery對象上調用jQuery的.hide()。這一點 - 如果你的DOM的導航是確定的 - 可能會工作：

$(this.childNodes[5].childNodes[0]).hide(); 

^{PS：你的所有的模板錨富人一樣id這是不是一個好的做法。儘量不要在您的html文檔中重複使用id。}