Как создать всплывающую подсказку в строке ag-grid?

Я хочу отображать всплывающую подсказку, условно основанную на поле status, при наведении курсора на всю строку (а не только на ячейки). В документации по API я нашел это: https://www.ag-grid.com/javascript-grid-column-properties/

tooltip Обратный вызов, который принимает (значение, valueFormatted, data, node, colDef, rowIndex и api). Он должен возвращать строку, используемую в качестве всплывающей подсказки. tooltipField имеет приоритет.

Можно ли это использовать для отображения всплывающей подсказки для всей строки? Если да, может ли кто-нибудь предоставить рабочий пример? Если нет, есть ли другой способ добиться этого?

Спасибо


ag-grid ag-grid-ng2
person Sandeep Kumar    schedule 29.06.2018    source источник
comment
почему бы просто не иметь одну и ту же подсказку для каждой ячейки (в перспективе строки)?   -  person un.spike    schedule 03.07.2018
comment
@ un.spike Спасибо за предложение, но в моей сетке более 20 столбцов. Было бы много повторяющегося кода.   -  person Sandeep Kumar    schedule 04.07.2018
comment
одна и та же часть обработчика всплывающих подсказок   -  person un.spike    schedule 04.07.2018

Ответы (3)


arrow_upward
18
arrow_downward

Я использую их так в определении столбца:

{
    field: 'fullAddress',
    headerName: 'Address',
    tooltip: (params) => 'Address: ' + params.value
}
person Quad Coders    schedule 10.08.2018
comment
как я могу также добавить html? - person ER.SHASHI TIWARI; 24.12.2018
comment
@ ER.SHASHITIWARI ты узнал? - person Bernardo Marques; 04.06.2020
comment
@ ER.SHASHITIWARI Вы захотите использовать tooltipComponent - person Rohmer; 19.11.2020
comment
подсказка устарела, используйте вместо нее tooltipValueGetter. - person Mano; 08.05.2021

arrow_upward
6
arrow_downward

Я нашел что-то вроде этого:

gridOptions.defaultColDef = {
    tooltip: (params) => {
        if (condition2) {
            return "Some txt";
        } else if (condition2) {
            return "Some txt2";
        } else {
            return "Some txt3";
        }
    }
};

Он добавит эту подсказку в качестве определений столбцов по умолчанию, поэтому вам не нужно копировать ее в каждое определение столбца.

-> ссылка на документацию: https://www.ag-grid.com/javascript-grid-cell-editing/

person kWakulewski    schedule 22.08.2018

arrow_upward
3
arrow_downward

Начиная с v20.1, colDef.tooltip устарел. Теперь вы можете установить всплывающую подсказку для каждого столбца, выполнив следующие действия:

{
    field: 'ItemDescription',
    headerName: 'Description',
    tooltipField: 'ItemDescription'
}

Вы можете увидеть документацию здесь.

person Quiver    schedule 12.05.2020