Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

315
Views
Format data returned from JSON in DataTable

I am reading a json file from remote url and displaying it in DataTable.

<script>
    $(document).ready(function () {
        $('#example').DataTable(
            {
            ajax: {
                method: 'GET',
                url: 'https://chainformed.s3.us-east-1.amazonaws.com/Data/mostwatched.json',
                dataSrc: ''
            },
            paging: false,
            responsive: true,
            language: {
    url: "//cdn.datatables.net/plug-ins/1.12.1/i18n/tr.json",
  },

            columns: [
                { "data": "id" },
                { "data": "rank" },
                { "data": "name" },
                { "data": "watchlist" },
                { "data": "percentage" },
                { "data": "difference" },
                { "data": "timestamp" }
                
            ]
        });
        $('.dataTables_length').addClass('bs-select');
    });
</script>

I would like to be able to format and manipulate the data returned from that json file. What is the best way to do it?

For example, i would like to change the values from ({ "data": "watchlist" }) field to number format with comma. How can i achieve it?

I tried this but with no luck: https://datatables.net/reference/option/ajax.dataSrc

enter image description here

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Use render element. Read document from Format output data - orthogonal data and example

Another way u can use columnDefs

<script>
$(document).ready(function () {
    $('#example').DataTable(
        {
        ajax: {
            method: 'GET',
            url: 'https://chainformed.s3.us-east-1.amazonaws.com/Data/mostwatched.json',
            dataSrc: ''
        },
        paging: false,
        responsive: true,
        language: {
url: "//cdn.datatables.net/plug-ins/1.12.1/i18n/tr.json",
},
        columns: [
            { "data": "id" },
            { "data": "rank" },
            { "data": "name" },
            { "data": "watchlist" },
            { "data": "percentage" },
            { "data": "difference" },
            { "data": "timestamp" }
        ],
        'columnDefs': [
            {
              "targets": 3,
              "data": "watchlist",
              "render": function ( data, type, row, meta ) {
                  return data.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
              }
            }
        ]
    });
    $('.dataTables_length').addClass('bs-select');
});
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!