Question

我正在尝试实现子行功能，以显示通过github上打包的Datatables，Tabletop和Bootstrap脚本的组合从Google电子表格中提取的更多列，并将它们显示为基本的Datable。这个基本的数据表是实时运行的，并且没有错误。

我创建了html页面和JS文件的副本，并根据Datatable参考页面修改了代码以实现子行。 html页面在这里：https://www.socialtheorywatch.org/database2.html 如果您需要查看原始的基本工作数据表代码，只需从URL中删除2。

Google chrome浏览器控制台和JShint不断在我的代码{的第73行中抛出Unmatched $(document).ready(function() {。完整的JShint错误列表如下所示：

四个警告127需要一个标识符，而看到了'）'。 127应该是一个赋值或函数调用，而是看到一个表达。 73不匹配的'{'。 128不可恢复的语法错误。（100％扫描）。

在出现语法错误问题之前，我用成功绘制了open / close列的方式很好地绘制了表格，但是onClick函数没有显示子行。我在Datables论坛上发布了该问题，他们通过从其前面的行中删除了一个封闭的大括号'}'，帮助我将了onClick函数移至writeTable函数底部。但是现在我遇到了语法错误，并且在所有运气不佳的地方添加/删除/重新放置了各种括号。

$(document).ready(function() {

  function initializeTabletopObject() {
    Tabletop.init({
      key: key,
      callback: function(data, tabletop) {
        writeTable(data); //call up datatables function
      },
      simpleSheet: true,
      debug: false });
  }

  initializeTabletopObject();

  function writeTable(data) {
    //select main div and put a table there
    //use bootstrap css to customize table style: http://getbootstrap.com/css/#tables
    $('#childRowTest').html(
      '<table cellpadding="4" cellspacing="4" border="1" class="table table-condensed table-bordered table-striped table-hover table-responsive" id="wrongfulConvictionDBSA"></table>'
    );

    //initialize the DataTable object and put settings in
    $("#wrongfulConvictionDBSA").DataTable({
      "autoWidth": false,
      "data": data,
      "columns": columns,
      "order": [
        [7, "desc"]
      ], //order on second column
      "pagingType": "simple_numbers" //'Previous' and 'Next' buttons, plus page numbers
      //"pageLength": 50
      //"lengthMenu": [ [10, 25, 50, -1], [10, 25, 50, "All"] ]
        //uncomment these options to simplify your table
        //"paging": false,
        //"searching": false,
        //"info": false
    });

  // Add event listener for opening and closing details
    $('#wrongfulConvictionDBSA tbody').on('click', 'td.details-control', function () {
        var tr = $(this).closest('tr');
        var row = table.row( tr );

        if ( row.child.isShown() ) {
            // This row is already open - close it
            row.child.hide();
            tr.removeClass('shown');
        }
        else {
            // Open this row
            row.child( format(row.data()) ).show();
            tr.addClass('shown');
        }
    });  
});
//end of writeTable

我正在解决语法错误。

Answer 1

这更像是对in this comment中描述的“表未定义”问题的解答，但是试图通过答复解决它似乎有些笨拙且不合适。

您的代码似乎基于this example。

但是在该示例中，声明了table变量并为其分配了DataTable调用的返回值：

  var table = $(...).DataTable({...})

并且您没有在代码中这样做：

//initialize the DataTable object and put settings in
$("#wrongfulConvictionDBSA").DataTable({
  "autoWidth": false,
  "data": data,
   ...

可能还有其他问题，但我首先要获取table变量，然后看看接下来会发生什么（如果有的话）。

如何使用6个函数修复脚本中不匹配的'{'与childRows的数据表

1 个答案: