First, I’ll presume your setup is pretty standard, with a web server (e.g. Apache) accessed by a browser. What you have now is a JS setup that handles one part of the problem. The other part is handled by the server. So, my recommendation is that the JS calls XmlHttpRequest to a URL on your server which is you PHP code, passing whatever parameters are required, and the call replies with the content of the file. When this response is received, the JS can update the cells as you wish. I would recommend that you use JSON as your response from the server, since that’s much easier to manage from JS.

This pattern is called REST, and there are a few common mistakes made by people when they first start writing this kind of code. The most common is to include the verb in the URL, something like myserver.com/getNumbers. Instead, it should be myserver.com/numbers, using HTTP GET. When adding to the file, use POST, for update use PUT and for removing use DELETE. Also, always sanitise the data going in *and* coming out.

var reader = new XMLHttpRequest();

function loadFile() {
    reader.open('get', 'http://127.0.0.1/data/test.txt', true);
    reader.onreadystatechange = displayContents;
    reader.send(null);
}

function displayContents() {
    if(reader.readyState==4) {
        var el = document.getElementById('main');
        el.innerHTML = reader.responseText;
    }
}

What you could try is to add an alert in the displayContents method, alerting the readystate. Something like alert(reader.readyState); If the pop-up doesn’t show, the function doesn’t get called. If the readystate is not 4, something else is the matter, and the file can’t be loaded.