根據條件隱藏欄列中的列菜單選項

Question

我正在使用Kendo欄菜單選項劍道grid.I希望通過第三個選項，即隱藏/顯示列時我想隱藏菜單如果該欄的標題爲空白。

在這裏，我想隱藏RefValue4和RefValue5，因爲它對應的值從database.so空未來就沒有必要顯示這些的。

我做的是這樣的：

if (grid.dataSource.data()[0].RefName4==null) { 
    grid.hideColumn(18); 
} 

，但無法達到的效果。

Answer 1

足夠檢查網格的第一行的內容（如您的代碼示例（在提出如果是這樣，你可以定義一個dataBound處理器隱藏的列：

dataBound : function (e) { 
    // Get reference to the grid 
    var grid = e.sender; 
    // Get reference to received data 
    var data = e.sender.dataSource.data(); 
    // Check that we actually received any data 
    if (data.length > 0) { 
     // Iterate on columns hiding those that in the first row have no data 
     $.each(grid.options.columns, function (idx, elem) { 
      if (!data[0][elem.field]) { 
       grid.hideColumn(idx); 
      } 
     }); 
    } 
} 

這將運行隨時隨地你從服務器接收數據，但正如我所說，只檢查第一個的內容，但你可以很容易地修改所有的檢查。這不實現隱藏列菜單標題從菜單。

看到一個跑步示例：http://jsfiddle.net/OnaBai/XNcmt/67/

編輯：如果您需要沒有數據的列沒有顯示，但也沒有顯示在菜單中，則需要在沒有這些列的網格中配置columns。

// Fetch data from the DataSource 
ds.fetch(function (d) { 
    // By default, no column in the grid 
    var columns = []; 
    // List of available column definitions 
    var definitions = [ 
     { field: "Id", hidden: true }, 
     { field: "FirstName", title: "First Name" }, 
     { field: "LastName", title: "Last Name" }, 
     { field: "City" }, 
     { field: "Position" } 
    ]; 
    // For each column in the definition check if there is data 
    $.each(definitions, function(idx, elem) { 
     if(d.items[0][elem.field]) { 
      // If there is data then copy the definition to columns 
      columns.push(elem); 
     } 
    }); 
    // Use received data plus the columns definition computed 
    $("#grid").kendoGrid({ 
     dataSource: d.items, 
     editable : false, 
     pageable : true, 
     columnMenu: true, 
     columns : columns 
    }).data("kendoGrid"); 
}); 

哪裏ds是DataSource定義：一旦收到做類似的數據可以在運行時做到這一點。

請看這裏：http://jsfiddle.net/OnaBai/XNcmt/69/