Geek Answers Handbook

HTML page that retains its contents, replacing the HTML file itself

I need to create an html page that automatically saves its contents.

This page is a 4-day activity report that should be updated by some users.

enter image description here

This page will only be used for 3/4 days (click the "Summary Status Summary Page" and that will tell me everything). Therefore, I do not want to waste time with the backend, but I want to do something like a trick to the client side, Javascript and HTML.

What I would like to do:

User access to the page, this page is published on our internal server, updates the status of the task and saves the page! I thought of doing this in two ways:

  • Each time I press the save button, it just replaces the old html content with the new one (replacing the html file itself)
  • Save the contents in a plan file that will be loaded every time the page is used, this second option obviously costs a lot more work.

Any suggestion? I meant, is there anything that can help me do this in just a few minutes? I have about 2 days to finish this :(

UPDATE: Guys, maybe I'm not explaining myself very well, I'm so wrong if I assume something like this:

A Javascript function that, when you click the save button, replaces the old html server file with a new one containing the updated line ...

Easy easy ...! I am a third-party developer. Not much experience with beautiful stylized interfaces :)

UPDATE . According to your answer, I assume that this is NOT the WAY to do this, without third-party logic, even if it is light, but it is impossible to reach it only from the client side scripts .. I already thought about it, but I hoped there was some then a trick that allows you to do this without server space :(

+5
source share
5 answers

Finally, since we can use PHP, we decided to do this: we put this in a file called prova.php, and we run it. This file shows the contents of the file "file.html" and saves the data to be saved in "salva.php".

<?php include('file.html');?> some added string </div> <button onclick="save()">SAVE</button> <script> function save(){ var newData=document.getElementById("myText").innerHTML; $.post( "salva.php", { data: newData} ); } </script>

The save file called salva.php, get the line and save in an existing file called "file.html".

 <?php $stringa=$_POST['data']; $ourFileName = "file.html"; $ourFileHandle = fopen($ourFileName, 'w') or die("can't open file"); fwrite($ourFileHandle,$stringa); fclose($ourFileHandle); ?>

file.html is a file that contains nothing at the beginning

+1
source

You can execute a programmed ajax request every 2 minutes, requesting new content and replacing it with the <body> .

I recommend using jQuery for this, as it helps you to do this quite easily: http://api.jquery.com/jquery.ajax/

+1
source

You can use Web Storage to store data at the local end of the user. And it is quite easy and supported by most modern browsers.

There are two “mechanisms” for using web storage.

  • sessionStorage maintains a separate storage area for each specified origin, available for the duration of the page session (assuming the browser is open, including reloading and recovery).
  • localStorage does the same, but persists even when the browser is closed and reopened.

Update:. If you want to store data on a server, but don’t want to worry about full-fledged database servers, perhaps you can use "SQLite". Basically its just a file running.

+1
source 
 <html> <head> <title>Button Writer</title> </head> <body onload="read()"> <!--<button onclick="writeInFile()">Save</button> --> <input type="button" id="somebutton" onclick="addText()"> <input type="text" id="myText" placeholder="Enter Name Here"> <div id="text2"></div> </body> //read a file and write content in text2 div, please set your path <script> function read(){ var xhr; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else if (window.ActiveXObject) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } xhr.onreadystatechange = function(){document.getElementById("text2").innerHTML=xhr.responseText;}; xhr.open("GET","file.txt"); //SET YOUR PATH xhr.send(); } function addText() { document.getElementById('text2').innerHTML += document.getElementById('myText').value; } </script> </html>

To write to a file, you must use AJAX + PHP. If you want, I will tell you how

+1
source

To directly answer your updated question: No, it is not possible to write a file to the server file system without installing anything on the server side of the server to handle this. How http security works, the client does not access the server this way. However, there are several internal (or “intermediate”) systems that you can configure for this. One old method was the WebDAV method. You can look for a WebDAV implementation for your preferred platform — there are several (including some based on server side javascript).

0
source

More articles:


All Articles