SlickGrid получает экземпляр сетки с помощью jQuery через элемент HTML

Question

Мой пример: https://jsfiddle.net/djL5ad7m/

В моем примере показан базовый пример SlickGrid . Я создаю Грид так:

var grid = new Slick.Grid("#myGrid", data, columns, options);

Эта переменная grid - это то, что меня интересует.

Я хочу получить именно этот элемент через jQuery - чтобы я мог вызвать внешнюю функцию и получить ту же переменную Grid, которую мой код сохраняет в "var grid" .

Я пытался получить его как $('#myGrid').data('Slickgrid'), но это не работает.

(Kendo UI Grid отлично это иллюстрирует - посмотрите мой пример с ним здесь и найдите код ниже)

/***** getGridExternalFunction *****/
  function getGridExternal(){
    var grid = $('#grid').data('kendoGrid');
    console.log('grid', grid);
  }

Answer 1

SlickGrid не присоединяется к HTML таким образом, хотя я видел это как стандартный шаблон в некоторых клиентских элементах управления JavaScript.
Тем не менее, это достаточно легко настроить самостоятельно с помощью jQuery:

var grid = new Slick.Grid("#myGrid", data, columns, options);
$('#myGrid').data('SlickGrid', grid);

вы можете получить его в другом месте кода, как показано:

var grid = $('#myGrid').data('SlickGrid');

Существует несколько предупреждений относительно вашего сообщения об ошибке: «не могу прочитать свойство 'data' of null" означало бы, что $('#myGrid') возвращает null, чего не должно быть, если присутствует элемент DOM myGrid. Не уверен, что там происходит.

Answer 2

Получить данные тела таблицы:

$('#myGrid').find('.slick-viewport')

Получить данные тела HTML:

$('#myGrid').find('.slick-viewport')[0].innerHTML

Чтобы получить данные заголовка, используйте .slick-header в селекторе.