Добавить события в Google визуализации Dataatable

Question

Добавить события в Google визуализации Dataatable

0

Здесь у меня есть google визуализация datatable:

        function drawTroskovnik() {
            var cssClassNames = {
        'headerRow': 'zaglavlje',
        'tableRow': 'red',
        'oddTableRow': 'red',
        'selectedTableRow': 'orange-background large-font',
        'hoverTableRow': 'prekoreda',
        'headerCell': 'gold-border',
        'tableCell': 'cell',
        'rowNumberCell': 'underline-blue-font'
    };

  // Create and populate the data table.
  var JSONObject = $.ajax({
                    url: 'getTroskovnik.php', // make this url point to the data file
                    dataType: 'json',
                    data:{id_akt:ajdi},
                    async: false,
                    type: 'POST',
                }).responseText;

  var data = new google.visualization.DataTable(JSONObject, 0.5);

for (var y = 0, maxrows = data.getNumberOfRows(); y < maxrows; y++) {
    for (var x = 1, maxcols = data.getNumberOfColumns(); x < maxcols; x++) {

      data.setValue(y, x, '<input id="costRedovi" vr="'+ ajdi + '" kol="'+ data.getColumnLabel(x) +'" class="form-control" value="'+data.getValue(y,x)+'">');
    }
} 
 for (var y = 0, maxrows = data.getNumberOfRows(); y < maxrows; y++) {

      data.setValue(y, 0, '<input class="span2 form-control" id="pocetak1" size="16" type="text" value="'+data.getValue(y,0)+'" readonly>');

} 


        data.addColumn('string', 'Kontrole');
        for (var y = 0, maxrows = data.getNumberOfRows(); y < maxrows; y++) {
        var mc= data.getNumberOfColumns()-1;
data.setValue(y, mc, '<a data-toggle="modal" data-target="#update" href="#" class="btn btn-success"><i class="fa fa-pencil"></i> Details</a>');

        }

         var table = new google.visualization.ChartWrapper({
          'chartType': 'Table',
          'containerId': 'chart2',
          'cssClassNames': 'cssClassNames',
          'options': {
        cssClassNames: cssClassNames,
        allowHtml: true
    }
        });


  // Create and draw the visualization.
  visualization = new google.visualization.Table(document.getElementById('tpltroskovnik'));
  visualization.draw(data, {'allowHtml': true, cssClassNames: {
    'headerRow': 'zaglavlje',
        'tableRow': 'red',
        'oddTableRow': 'red',
        'selectedTableRow': 'orange-background large-font',
        'hoverTableRow': 'prekoreda',
        'headerCell': 'gold-border',
        'tableCell': 'cell',
        'rowNumberCell': 'underline-blue-font'
  }});
}
new google.visualization.events.addListener(visualisation, 'ready', function () {
        google.visualization.events.addListener(visualisation, 'select', function () {
            var selection = visualisation.getSelection();
            console.log(selection);
            //alert(data.getValue(visualization.getSelection()[0].row, 0));


              ajdi = data.getDataTable().getValue(selection[i].row,0);
              console.log(data.getDataTable().getValue(selection[i].row,0));
              console.log(data.getDataTable().getColumnLabel(selection[i]));


        })

    });

но где мне нужно добавить СОБЫТИЯ:

new google.visualization.events.addListener(visualisation, 'ready', function () {
            google.visualization.events.addListener(visualisation, 'select', function () {

Я пытаюсь в конце кода, но я получаю ошибку: визуализация не определена... также как getselection() выбранной строки? и как запустить функцию SSS(); когда таблица готова?

gmaestro 01 апр. 2014, в 00:14

Источник

Теги:

javascript

jquery

events

google-visualization

1 ответ

Ещё вопросы

asgallant · Accepted Answer · 2014-03-31T19-25-00.000Z

Обработчик событий должен быть создан в той же области, что и визуализация. Кроме того, в общем случае вы хотите настроить все обработчики событий перед тем, как нарисовать диаграмму (особенно "готовые" обработчики событий).

В вашем случае это будет выглядеть примерно так:

visualization = new google.visualization.Table(document.getElementById('tpltroskovnik'));

// add select event
google.visualization.events.addListener(visualisation, 'select', function () {
    var selection = visualisation.getSelection();
    for (var i = 0; i < selection.length; i++) {
        // selection[i].row contains the row index, eg:
        console.log(data.getValue(selection[i].row, 1));
    }
});
// run SSS when table is ready
google.visualization.events.addListener(visualisation, 'ready', SSS);

visualization.draw(data, {
    'allowHtml': true,
     cssClassNames: {
        'headerRow': 'zaglavlje',
        'tableRow': 'red',
        'oddTableRow': 'red',
        'selectedTableRow': 'orange-background large-font',
        'hoverTableRow': 'prekoreda',
        'headerCell': 'gold-border',
        'tableCell': 'cell',
        'rowNumberCell': 'underline-blue-font'
    }
});

опять получаю: визуализация не определяется
также, когда я различаю визуализацию var перед функцией, я получаю эту ошибку: Uncaught TypeError: Невозможно прочитать свойство '__eventTarget' из неопределенного
Обновите ваш вопрос, указав полный код JavaScript.
моя ошибка, все работает нормально, я решаю проблему с нашим кодом, спасибо
Что это за ошибка? Я получаю сообщение об ошибке: не удается прочитать свойство '__eventTarget' из неопределенного