Load Text File Into JQuery DataTables

Question

I am attempting to load a text file into JQuery DataTables. This is my HTML I have set-up for the button press

<div style="text-align:center;padding:20px 0px 0px 0px;">
    <span class="badge badge-info" style="font-size: 1.5rem; font-weight: 700;padding-bottom: 10px;margin-bottom: 20px;" id="txtFile">Get Registered Names</span>
</div>

And this is the html I have setup for the actual JQuery Datatable

<div>
    <table id="tblData" class="display" cellspacing="0" width="100%">
      <thead>
        <tr>
          <th>Name</th>
        </tr>
      </thead>
    </table>
</div>

And this is the JQuery I am wanting to use to load the table from the text file

$(function (){
    $('#txtFile').click(function() {
        $('#tblNames').dataTable({
            "ajax": 'registeredusers.txt',
            "columnDefs": 
            [{  
              "data": "Name"
            }]
        });
    });
});

This file is located in /var/www/html/ and I want to display it to the user on a button press event. How would I do this?

Does this link help you? And try the text file accessible via browser stackoverflow.com/questions/29307354/…. — vimuth
– vimuth, Commented Mar 16, 2021 at 6:42
@vimuth - Can I set this "ajax": "data/object.txt", to my local path of '"ajax": "/var/www/html/names.txt" — James Mandatory
– James Mandatory, Commented Mar 16, 2021 at 6:46
No it should be just 'names.txt'. And try '/names.txt' this too if it doesn't work. And it should be visible from browser like this.datatables.net/examples/ajax/data/arrays.txt. ex:- "ajax": "names.txt" — vimuth
– vimuth, Commented Mar 16, 2021 at 6:48
@vimuth - I get this error DataTables warning: table id=tblDomains - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1 — James Mandatory
– James Mandatory, Commented Mar 16, 2021 at 6:53
Can you share the link to .txt file so I can check json format is correct? — vimuth
– vimuth, Commented Mar 16, 2021 at 6:54

vimuth · Accepted Answer · 2021-03-16 16:57:58Z

1

Your registeredusers.txt should have data like this,

{
    "data": [
        [
            "jason",
        ],
        [
            "mark",
        ],
        [
            "Richard",
        ],
     ]
}

And you can't initialize datatable multiple times. So add $("#tblData").dataTable().fnDestroy(); before create datatable.

$(function (){
    $('#txtFile').click(function() {
        $("#tblData").dataTable().fnDestroy();
        $('#tblData').dataTable({
            "ajax": 'registeredusers.txt',
            "columnDefs": 
            [{  
              "data": "Name"
            }]
        });
    });
});

edited Mar 16, 2021 at 16:57

answered Mar 16, 2021 at 7:41

vimuth

5,87355 gold badges98 silver badges128 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mohammad Fahad Rao · Accepted Answer · 2021-03-16 06:41:00Z

0

You can try getting content from php file with

$data = file_get_contents('yourfile.txt');

then get this data and replace with your rows

answered Mar 16, 2021 at 6:41

Mohammad Fahad Rao

1902 silver badges18 bronze badges

2 Comments

James Mandatory Over a year ago

I get an error Uncaught ReferenceError: file_get_contents is not defined The exact syntax I tried was $data = file_get_contents('/var/www/html/names.txt');

Mohammad Fahad Rao Over a year ago

Kindly, refer to this example tryphp.w3schools.com/…

Collectives™ on Stack Overflow

Load Text File Into JQuery DataTables

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related