I know that you can write to the current HTML document, but I want to write to another html file.
For example:
I have 2 files, one is index.html, and the other is completedsurvey.html
I want to write something to the completedsurvey.html from my index.html file. Is there a way
to do this that is supported in most browsers?
-
Why do you need two files? You can replace the content of the current page.epascarello– epascarello2021-02-17 02:12:26 +00:00Commented Feb 17, 2021 at 2:12
-
Are you talking about data, like a filled in form?evolutionxbox– evolutionxbox2021-02-17 02:16:43 +00:00Commented Feb 17, 2021 at 2:16
-
Please note that when people talk about the document or DOM in JavaScript, they don’t mean the actual html fileevolutionxbox– evolutionxbox2021-02-17 02:25:30 +00:00Commented Feb 17, 2021 at 2:25
-
@evolutionxbox yes, I want to transfer data from a filled in form to another document.Oblique– Oblique2021-02-17 03:38:55 +00:00Commented Feb 17, 2021 at 3:38
-
Here is what I understand that you need: You fill data from in a form on index.html, and after processing it, you want to show users what they filled on completedsurvey.html?Bipin– Bipin2021-02-17 03:44:48 +00:00Commented Feb 17, 2021 at 3:44
|
Show 3 more comments
1 Answer
So for the first solution: Assuming you'd want to display "username" and "summary" on successful submission of the form. This isn't an exact solution, just something you can use to get the concept.
index.html
<form>
<input type='text' id="username">
<input type='text' id="summary">
<button type="button" id="process-form">
</form>
<script>
document.getElementById('process-form').addEventListener('click', (eve)=>{
var uname = document.getElementById('username');
var summ = document.getElementById('summary');
localStorage.setItem('uname', uname);//saving the data in local storage
localStorage.setItem('summ', summ);
//redirect to next page...
});
</script>
surveycomplete.html
<!doctype>
.
.
<div>
<h1 id="name"> </h1>
<p id='summary'> </p>
</div>
<script>
var uname = localStorage.getItem('uname');//retrieving from local storage
var summ = localStorage.getItem('summ');
document.getElementById('name').innerHTML = uname;//fill the fields with data
.
.
</script>
Further Links: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
