顯示工具提示onHover SlickGrid的行

我有一個任務，在slickgrid的每一行上放一個工具提示。我知道如何ajax它。但是，閱讀slickgrid文檔沒有任何選項，如「懸停」或「工具提示」。

我的電話是這樣的：

var grid = new gridd.Grid("#ite", result, 
       [{ id: "var1", field: "var1" }, 
        { id: "var2", field: "var2" }, 
        { id: "var3", field: "var3", width: 100, resizable: false }, 
        { id: "var4", field: "var4", width: 110, resizable: false}], 
       { forceFitColumns: true }, 
       //I thought of something like 
       { onHover: function.. }, 
       // 
       { onClick: function (e, row, cell) { 
        var result = this.getData(); 

        postSomething(result[row]); 
       } 
      });

來源

2012-06-15 Jaime Yule

一個選項，讓你的信息是訂閱到網格的事件onMouseEnter和onMouseLeave。你可以使用任何你想讓文本跟隨鼠標的工具提示庫。

使用該事件來發現您在上面的單元格。我使用數據視圖，所以需要使用view.getItem以防萬一行被過濾掉。如果您只是簡單地顯示數據而不進行過濾，我相信data[cell.row]會起作用，但您需要測試。

這隻會讓你把信息放在工具提示中，你需要使用類似於this的東西來獲得它在鼠標後的工具提示。對於我的測試，我只更新了一個標籤（id = boringLabel），標籤正確更新。

var grid = new Slick.Grid(selector, view, cols, opts); 

.... 

grid.onMouseLeave.subscribe(function(e, args) { 
    $("#boringLabel").text("NONE"); 
}); 

grid.onMouseEnter.subscribe(function(e, args) { 
    var cell = args.grid.getCellFromEvent(e); 
    var item = view.getItem(cell.row); 
    $("#boringLabel").text(item.id + " " + item.description); 
});

來源

2012-06-16 17:02:12 Edward

好，首先謝謝@Edward的回覆。我嘗試訂閱網格的事件，但是螢火蟲告訴我grid.onMouseLeave是未定義的。是的，我知道如何製作一個酷的div，並把我的數據放到彈出窗口中。 –

也許是因爲slickgrid js中沒有onMouseLeave或onMouseEnter。我使用SlickGrid v1.4.3 - jquery-ui.slickgrid.js。謝謝你。 –

@MalGaniS我在2.0.1上，這可能是爲什麼。 – Edward

顯示工具提示onHover SlickGrid的行

回答

相關問題