0

I've been working on a web page which can't use PHP so I had to look up a solution without. I now have the following jQuery code:

function writeFile() {
  alert("writing file...");

  $.ajax({
    type: 'POST',
    url: "test.txt", // url of receiver file on server
    data: "test", // your data
    success: alert("sucess writing the file!"), // callback when ajax request finishes
    dataType: "text" // text/json
  });
};

The file is where it should be and the alert() are showing up (also the success alert) but somehow the file is empty. Why?

Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
fipsi
  • 81
  • 1
  • 7
  • Note that the second `alert()` is only showing up because you execute it as soon as the `writeFile()` function is called. It's not actually dependent on the success of the AJAX request. I'd suggest reading the `$.ajax` documentation to see exactly how to provide a handler function to that event. Firstly, check the console to see exactly is happening with the request. Secondly, note that JS cannot write to a file on the server, so I'm not certain what goal you're hoping this logic will achieve – Rory McCrossan Feb 02 '18 at 15:04
  • Possible duplicate of [Is it possible to write data to file using only JavaScript?](https://stackoverflow.com/questions/21012580/is-it-possible-to-write-data-to-file-using-only-javascript) – Drew Kennedy Feb 02 '18 at 15:06
  • You can download data to a file on the user's PC using javascript, but you cant tell the server to save it, unless the server has a url you can POST to waiting for an action parameter to tell it to write a data parameter to a file - for example. – Andrew Feb 02 '18 at 20:21

2 Answers2

1

AJAX cannot directly write to a file, because JavaScript is a client side only and not server side. What you want is a server that catches your AJAX request; server can be anything, including PHP, JAVA or NodeJS. You can only read static files using AJAX but that is all.

freedomn-m
  • 27,664
  • 8
  • 35
  • 57
Sanket Patel
  • 308
  • 3
  • 19
0

You can't just write to a text file on the server using client-side AJAX scripting. You will have to use Node.JS or a PHP server-side script to write to the file on the server. This example below uses a PHP script. You will want a file called test.php in the same directory as the page the AJAX is on. This will POST the string "hello world" to test.php, as the superglobal $_POST['textcontent']. It is possible, using an anonymous function in the success field, to get the output from the PHP script and show it on the page. Note that you can replace "hello world" in the example below, to a $("#my-input-area").val() variable, if you want to write user input to a file.

function writeFile() {
    alert("writing file...");
    
    $.ajax({
        type: "post",
        url: "test.php",
        data: {
            textcontent: "hello world",
        },
        success: function(response) {
            $("#ajax-area").html(response);
        }
    });
};

And then your PHP will look like this.

test.php

<?php

if (!empty($_POST['textcontent'])) {
    file_put_contents("test.txt", $_POST['textcontent']);
    exit("<p>TXT file written successfully!</p>");
}
// This is where you write to the text file.
// The string in the exit() function will appear in your $("#ajax-area")
else {
    exit("<p>No text string submitted.</p>");
}

?>

Using the above example, the PHP script will receive the string "hello world" from the AJAX call. This will write to the test.txt file in the same directory as your PHP script, which would be in the same directory as the page with the AJAX. You can put these in a different folder on the server if you want. Anything the PHP script outputs, either with echo or with exit, will be returned as the response parameter, in your success function in your AJAX call.

I hope any of this helps.

Community
  • 1
  • 1
Tanner Babcock
  • 3,232
  • 6
  • 21
  • 23