GetColumnLabel 名称并运行 ajax 函数 - google viz datatable答案

【问题标题】：GetColumnLabel name and run ajax function - google viz datatableGetColumnLabel 名称并运行 ajax 函数 - google viz datatable
【发布时间】：2014-03-25 00:09:20
【问题描述】：

我这里有google可视化DataTable：

所以我有这个代码：

function drawTroskovnik() {


  // 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" 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>');

        }
new google.visualization.events.addListener(table, 'ready', function () {
        google.visualization.events.addListener(table.getChart(), 'select', function () {
            var selection = table.getChart().getSelection();
            //HOW TO GET LABEL of COLUMN an DATE from row so to use it in ajax submit
     $( "#costRedovi" ).focusout(function() {
            $.ajax({
            url: "update.php",
            type: "POST",
            async: true, 
            data: { columnName:HOW_to_get_column_name,datum:How_to_get_date_from_row_where_is_selected_cell?}, 
            dataType: "html",

            success: function(data) {
                console.log(data);   
            },  
        });
  })
                        }
        });
    });
  // Create and draw the visualization.
  visualization = new google.visualization.Table(document.getElementById('tpltroskovnik'));
  visualization.draw(data, {'allowHtml': true, cssClassNames: 'nn' }});
}

我需要做什么？现在我将每个单元格值放入输入字段中，所以我可以更改它。我想在.focusout 上运行.ajax 函数到数据库中的update 数据，但要做到这一点，我需要get Column Label Name and date（如您在照片上看到的那样 - 日期是行中的“0”位置...... )

如何获取焦点输出单元格的列标签名称和日期？

【问题讨论】：

标签： javascript jquery ajax google-visualization googlevis

【解决方案1】：

您需要做的是调用getValue 对您在选择处理程序中放入表中的数据。相关代码为：

        var row = table.getSelection()[0].row;
        console.log(data.getValue(row,0));

看看这个小提琴，如果你有更多问题，请告诉我：

http://jsfiddle.net/WTb8H/

【讨论】：

:) 好的，我知道，但是如果您看到我的问题，我需要在单击表格单元格时获取该单元格的列标签名称和行中的日期，所以现在我有了日期，但我没有列标签名称...
jsfiddle.net/WTb8H/1，同样当我点击一次，然后再点击一次，我得到错误，在控制台中查看
好的，有两件事：选择是粘性的，所以第二次选择同一行时，它充当取消选择选项。其次，当前表格视图不发送列。让我想想怎么得到它……
你能用 googel viz API 的 getColumnLabel 得到它吗？
那么，如果我有更多的列，，，等等 5 列......你也可以在一个 jsfiddle 中输入所有代码吗？

【解决方案2】：

解决这个问题很容易，所以我用新的更好的方式得到了 columnLabel：

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" kol="'+ data.getColumnLabel(x) +'" class="form-control" value="'+data.getValue(y,x)+'">');
    }
}

所以解决方案是：data.getColumnLabel(x)，现在每个输入都有属性kol，现在可以在数据表准备好时轻松运行 ajax 代码。

【讨论】：