Error using JSON with datatable

Asked

Viewed 368 times

-3

I’m trying to implement my json using the tool datatable, follows my json:

[
{"Nome":"Felipe","Data":null,"Tipo":"Normal","RG":"123456798"},
{"Nome":"Felipe2","Data":null,"Tipo":"Normal","RG":"123456798"},
{"Nome":"Felipe3","Data":null,"Tipo":"Normal","RG":"123456798"}
]"

fix an example on JSFIDDLE url: https://jsfiddle.net/o3b8tf32/

After that, I would like to know if there is any possibility of leaving the heading dynamic, that is, the <th></th> of <thead>

Thank you

1 answer

2


Follow Jsfiddle with the answer: https://jsfiddle.net/o3b8tf32/1/

Missed the <tr> in the <thead> in the table statement:

<table class="table table-bordered">
  <thead>
  <tr>
    <th>Nome</th>
    <th>Data</th>
    <th>Tipo</th>
    <th>RG</th>
    </tr>
  </thead>
</table>

And also fix the Datatable constructor

$(document).ready(function() {

  var dataSet = [ {  "Nome": "Felipe",  "Data": "null",  "Tipo": "Normal",  "RG": "123456798"}, {  "Nome": "Felipe2", "Data": "null", "Tipo": "Normal", "RG": "123456798"}, { "Nome": "Felipe3", "Data": "null", "Tipo": "Normal", "RG": "123456798"}];

  $('.table').DataTable({  
     data: dataSet,
        columns: [
            { data: "Nome" },
            { data: "Data" },
            { data: "Tipo" },
            { data: "RG" }
        ] 
    });
});

Follow the documentation from Datatables.net with datasource Javascript.

Here is also an example with dynamic columns: https://jsfiddle.net/o3b8tf32/6/

  • Thanks @Thiago , friend, has to leave the header of <thead> dynamic, tipow, the name of the property already pick up direct by ajax

  • 1

    For the record, follow Fiddler with dynamic generation of column https://jsfiddle.net/rboschini/o3b8tf32/5/

  • Legal, @Rboschini. I made an update with column filter: https://jsfiddle.net/o3b8tf32/6/

Browser other questions tagged

You are not signed in. Login or sign up in order to post.