JQuery function isn't transforming the table :( Help please.

JQuery function isn't transforming the table :( Help please.

COLTstreetCOLTstreet Posts: 3Questions: 2Answers: 0
edited May 2015 in Free community support

So I'm generating an HMTL table from a CSV file using D3.js library. After generating this table I'd like to use the DataTables to transform it. Unfortunetely, the table isn't transorming into the new DataTable. I thought it was because the table wasn't loaded yet but I've tried calling the jquery after everything on the page loads with no success. I've posted the code below. This is the body with the scripts inside it. I've tried the jquery call in multiple locations and it still doesn't work. Any help would be greatly appreciated. Thanks.

<body>
    <script src="http://d3js.org/d3.v3.min.js"></script>

    <script type="text/javascript" charset="utf-8">
        d3.text("Book1.csv", function (data) {
            var parsedCSV = d3.csv.parseRows(data);

            var container = d3.select("body")
                .append("table").attr("id", "table_id")

            .selectAll("tr")
                .data(parsedCSV).enter()
                .append("tr")

            .selectAll("td")
                .data(function (d) {
                    return d;
                }).enter()
                .append("td")
                .text(function (d) {
                    return d;
                });
        });
    </script>
    <script >
        
        $(document).ready(function () {
            $('#table_id').DataTable();
        });
        $('#table_id').DataTable({
            paging: false
        });
    </script>
</body>
This discussion has been closed.