как присвоить значения TR в таблице панели инструментов Google

я использую функциональные возможности таблицы Google Dashboard, я хочу присвоить значение id tr каждой созданной строки, у меня есть следующий массив

   var data = google.visualization.arrayToDataTable([
      ['Name', 'Donuts eaten','id'],
      ['Michael' , 5,'1'],
      ['Elisa', 7,'2'],
      ['Robert', 3,'3'],
      ['John', 2,'4'],
      ['Jessica', 6,'5'],
      ['Aaron', 1,'6'],
      ['Margareth', 8,'7']
    ]);

      var table = new google.visualization.ChartWrapper({
                    'chartType': 'Table',
                    'containerId': 'chart2',
                    dataTable: data,
                    'options': {
                        'width': '500px'
                    }
                });
                table.draw();

Я до сих пор не могу понять, есть ли способ привязать значения к элементам DOM, любая помощь будет оценена.


javascript jquery google-visualization google-datatable
person noobie-php    schedule 18.12.2013    source источник
comment
прочитайте ответ asgallant и последний комментарий. Используйте плагин и помогите улучшить или сделать свой собственный... :)   -  person Sami    schedule 26.12.2013
comment
хорошо, сделать мою собственную для выполнения конкретной работы очень просто, но эта таблица / функция связана с Dashoard, если мы не можем изменить, какой смысл использовать 1? потому что их уже слишком много.   -  person noobie-php    schedule 27.12.2013

Ответы (3)


arrow_upward
3
arrow_downward

Вот одно решение с использованием JQuery:

google.visualization.events.addListener(table, 'ready', function () {
  $('#chart2 .google-visualization-table-tr-odd, #chart2 .google-visualization-table-tr-even').each(function (e) {
      var idx = $('td:nth-child(2)', this).html();
      $(this).attr('id', 'row' + idx);
    });
  });

И чтобы удалить столбец ID:

google.visualization.events.addListener(table, 'ready', function () {
  $('.google-visualization-table-tr-head td:nth-child(3)').remove();
  $('#chart2 .google-visualization-table-tr-odd, #chart2 .google-visualization-table-tr-even').each(function (e) {
      var td = $('td:nth-child(2)', this)
      var idx = td.html();
      td.remove();
      $(this).attr('id', 'row' + idx);
    });
  });

С учетом сортировки:

function tableCleanUp() {
  google.visualization.events.addListener(table.getChart(), 'sort', tableCleanUp2);
  tableCleanUp2();
}

function tableCleanUp2() {
  $('.google-visualization-table-tr-head td:nth-child(3)').remove();
  $('#chart2 .google-visualization-table-tr-odd, #chart2 .google-visualization-table-tr-even').each(function (e) {
      var td = $('td:nth-child(2)', this)
      var idx = td.html();
      td.remove();
      $(this).attr('id', 'row' + idx);
    });
}

google.visualization.events.addListener(table, 'ready', tableCleanUp);
person Eran Boudjnah    schedule 29.12.2013
comment
Спасибо за ответ, я попробовал это, это работает, но имеет ограничения: столбец идентификатора, который я передал в приведенном выше примере, был просто примером, я имел в виду, что он будет отображаться, поскольку идентификатор должен применяться как ‹tr id=''...› что-то вроде этого, то, как вы это делаете, хорошо, что вы берете какое-то имя столбца, берете его значение html и назначаете его ‹tr id...›, ограничение состоит в том, что я не хочу передавать его как столбец val. - person noobie-php; 30.12.2013
comment
Как же ты хочешь его пройти? Вам нужен какой-то способ идентифицировать рассматриваемую строку, если вы хотите присвоить ей идентификатор из вашего массива данных. - person Eran Boudjnah; 30.12.2013
comment
я хочу присвоить значение идентификатора tr каждой созданной строки, это то, что я процитировал, как упоминалось ранее, что я ценю ваше решение, но идентификатор в массиве данных был отправлен таким образом, чтобы его можно было присвоить идентификатору TR, как я думаю, мы все знаем, что обычно мы не отображаем идентификатор в столбцах, так как он может исходить из БД, если вы немного измените это, я обязательно отмечу ваш вопрос как истинный. - person noobie-php; 30.12.2013
comment
Две вещи: во-первых, если вы беспокоитесь о безопасности, то тот факт, что идентификатор отправляется с сервера, будет достаточно плохим, независимо от того, отображаете ли вы его в столбце или нет. Во-вторых, я до сих пор не понимаю, как вы хотите назначить правильный идентификатор. Есть ли уникальный ключ в массиве? Это имя? Потому что, если у меня есть 2 Майкла, как вы ожидаете, что код узнает, какой идентификатор назначить каждому Майклу? - person Eran Boudjnah; 30.12.2013
comment
ну, оба меня беспокоят на данный момент, во-первых, я не хочу отображать идентификатор для 1) безопасности 2) я не хочу, чтобы это было в моем представлении. Единственным уникальным идентификатором для каждой строки является ID. - person noobie-php; 30.12.2013
comment
Хорошо, тогда вопрос безопасности, как я уже сказал, не актуален. Пока вы передаете идентификатор клиенту, вы должны предполагать, что пользователи могут его прочитать. Вы хотите удалить поле идентификатора после назначения идентификатора? Решит ли это вашу вторую часть? - person Eran Boudjnah; 30.12.2013
comment
да, я могу попробовать это. - person noobie-php; 30.12.2013
comment
Отредактировано для добавления альтернативы, которая удаляет столбец идентификатора после чтения его содержимого. - person Eran Boudjnah; 30.12.2013
comment
ах, еще одна проблема, таблица Google сортируется, поэтому, когда я сортирую столбцы, удаленное поле снова отображается. попробуйте, и вы поймете, о чем я. - person noobie-php; 30.12.2013

arrow_upward
0
arrow_downward

В визуализации таблицы нет поддержки для назначения идентификаторов tr. Вы должны проанализировать созданный HTML вручную, чтобы установить их соответствующим образом.

person asgallant    schedule 18.12.2013
comment
И как сделать? Может быть приемлемый ответ. Я пробовал, но не получилось :( - person Sami; 25.12.2013
comment
Нет простого способа сделать это. Вы должны проанализировать свою таблицу, чтобы сопоставить значения в ячейках таблицы со значениями в вашем DataTable, чтобы однозначно идентифицировать строку (что может быть невозможно, если некоторые из ваших строк содержат повторяющиеся данные). Проще всего, если у вас есть одна ячейка с уникальным значением ключа для каждой строки. - person asgallant; 26.12.2013
comment
Если вы позволите беззастенчивый плагин продукта, у меня есть визуализация таблицы с открытым исходным кодом (под лицензией GPLv3) в бета-версии, которая предоставляет функциональные возможности, превышающие возможности визуализации таблиц Google по умолчанию, включая возможность назначать атрибуты (например, идентификатор) к элементам таблицы. Вы можете получить его здесь: github.com/asgallant/gViz.Table. Это во многом бета-версия продукта (читай: вероятно, в ней масса нераскрытых ошибок), поэтому я не думаю, что она готова для производственной среды, но если бы я мог найти активных тестировщиков, ошибки можно было бы быстро исправить. - person asgallant; 26.12.2013

arrow_upward
-1
arrow_downward

В простейшей форме это можно сделать следующим образом: tr.id = containerId;

person asdasd    schedule 18.12.2013
comment
и где его использовать? ContainerId должен быть идентификатором всего контейнера, я думаю, не только 1 TR. - person noobie-php; 18.12.2013