Строка подсказки onHover SlickGrid по

Я новичок с jquery.

У меня есть задача поместить подсказку на каждую строку slickgrid. Я знаю, как это сделать. Но, читая документацию slickgrid, нет ничего в опциях, таких как "hover" или "tooltip".

Мой звонок такой: 

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]);
                }
            });
1 2
.net jquery title tooltip slickgrid

1 ответ:

Один из вариантов получения информации-подписка на события сетки onMouseEnter и onMouseLeave. Вы можете использовать любую подсказку lib, которую вы хотите, чтобы текст следовал за мышью.

Используйте событие, чтобы узнать, в какой ячейке вы находитесь выше. Я использую dataview, поэтому нужно использовать view.getItem в случае, если какие-либо строки были отфильтрованы. Если вы просто показываете данные без фильтрации, я думаю, что data[cell.row] будет работать вместо этого, но вам нужно будет протестировать.

Это только даст вам информацию, чтобы положить в tooltip, вам нужно будет использовать что-то вроде 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);
});
5