Period '.' in column header of DataTable causes error

Period '.' in column header of DataTable causes error

kvaskokvasko Posts: 18Questions: 6Answers: 0

DataTables warning: table id=DataTables_Table_3 - Requested unknown parameter 'hello .7' for row 0, column 0.

How can I escape a period in my column header to not get this error message? The problem does not exist in the actual cell values.

This question has an accepted answers - jump to answer

Answers

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin

    Use a double backslash - there is an example and explanation in the columns.data documentation.

    Allan

  • kvaskokvasko Posts: 18Questions: 6Answers: 0
    edited July 2016

    Thanks allan but that does not seem to work for the header. I still get the same error message.
    This is the JSON data I was testing with.

                "Table": [
                    {
                        "hello World": "Testing",
                        "hello \\. World": "DataTable test"
                    }
                ],
    

    I attached an image to show the data in the object in my app. The object only shows one '\' in the browser. There are two in the database, and two in the return of my database call to the API (e.g. I perform my RESTAPI call and I get back

    "Table": [{"hello World": "Testing", "hello \. World": "DataTable test"}],

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin

    Can you link me a link to the page showing the issue so I can debug it please?

    Allan

  • kvaskokvasko Posts: 18Questions: 6Answers: 0

    I can't unfortunately as it is an internal application. What do you need that would help you debug the problem?

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin

    A link to a JSFiddle, CodePen or http://live.datatables.net example that demonstrates the issue would be ideal.

    Thanks,
    Allan

  • kvaskokvasko Posts: 18Questions: 6Answers: 0
    edited August 2016

    Fiddle:

    http://live.datatables.net/luxuxere/1/edit

    HTML

    <!DOCTYPE html>
    <html>
    <head>
    <script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <link href="https://nightly.datatables.net/css/jquery.dataTables.css" rel="stylesheet" type="text/css" />
    <script src="https://nightly.datatables.net/js/jquery.dataTables.js"></script>

    <meta charset=utf-8 />
    <title>DataTables - JS Bin</title>
    

    </head>
    <body>
    <div class="container">
    <table width="100%"String class="display"String id="example"String></table>
    </div>
    </body>
    </html>

    JS

    var dataSet = [
    {"Nam.e": "Nixon"}
    ];

    var columnSet= [
    {
    title: "Nam.e",
    data: "Nam.e",
    }
    ];

    $(document).ready(function() {
    tbl = $('#example').DataTable({
    columns: columnSet
    });
    tbl.clear().rows.add(dataSet).draw();
    });

    So it looks like I need to escape the "." in my dataset and my data reference columnSet. But the \ doesn't work.

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin
    Answer ✓

    Escaped with a double back slash works: http://live.datatables.net/luxuxere/2/edit .

    Allan

  • kvaskokvasko Posts: 18Questions: 6Answers: 0

    Ah....okay, that works. I was escaping both the data and title keys and the data itself.
    http://live.datatables.net/luxuxere/3/edit

    Is there a way to sanitize the data before hand to have whatever text is being passed to DataTables to be treated as a string no matter what (and not get interpreted like I was seeing)?

  • allanallan Posts: 61,438Questions: 1Answers: 10,052 Site admin

    No, sorry. You would need to escape it like the example above since the . in columns.data is typically used to refer to a nested property.

    Allan

This discussion has been closed.