how to save input field data to text file without flushing out the textboxes

Question

I am making a thing for setting goals,and to show your progress, I use the progress element. I would like to save my goal with php/js/other to a .txt file on my server called user.txt. I have already tried this Write server text files with Ajax and PHP write file from input to txt shows what I want, but instead of form tags, I want just 2 input fields Is there any way I can merge these 2 files to save my data from my 2 fields to a text file(user.txt) Here is my code:

function myFunction() {
  var x = document.getElementById("myTextarea").value;
  document.getElementById("myProgress").value = x;
}

function myFunction2() {
  var x = document.getElementById("myTextarea2").value;
  document.getElementById("myProgress").max = x;
}

progress {
  color: #0063a6;
  font-size: .6em;
  line-height: 1.5em;
  text-indent: .5em;
  width: 30em;
  height: 3em;
  border: 1px solid #0063a6;
  background: #fff;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<h3>Goal Progress:</h3>
<progress id="myProgress" value="0" max="100">
</progress>

<hr>
<input type="text" id="myTextarea"></input>
<button onclick="myFunction()">Add</button>
<hr>
<input type="text" id="myTextarea2" />
<button onclick="myFunction2()">Set Goal</button>
<hr>

You said you tried [this](http://stackoverflow.com/questions/26961750/write-server-text-files-with-ajax) but I'm not seeing it on your sample code... — Jérémy Halin, Jan 15 '16 at 14:33
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/100784/discussion-between-parseguy-and-hjerem). — parseguy, Jan 15 '16 at 15:58
You should look into jQuery AJAX functions in order to save the results to a file on your server. Right now this question is too broad since you have no AJAX or PHP shown. — j08691, Jan 16 '16 at 22:28
I don't know those langs and was hoping you could write a demo file for me that could do what my question asks — parseguy, Jan 17 '16 at 12:12

score 0 · Accepted Answer · answered Jan 17 '16 at 13:56

here I finally solved my perplexing paradyme:

<html>
<body onload="timer=setTimeout('myFunction2(); myFunction();',3000)">
<style>
progress {
  color: #0063a6;
  font-size: .6em;
  line-height: 1.5em;
  text-indent: .5em;
  width: 30em;
  height: 3em;
  border: 1px solid #0063a6;
  background: #fff;
}
</style>
<h3>Goal Progress:</h3>
<progress id="myProgress" value="0" max="100">
</progress>

<hr>
<form action="form.php" method="POST">
add money:
<input type ="text" name="field1" id="myTextarea"></input>
<hr>
Goal:
<input type ="text" name="field2" id="myTextarea2"/>
<input type="submit" name="submit" value="Save Data">
</form>
<hr>
<button onclick="myFunction2(); myFunction();">show new progress</button>
<script>
function myFunction() {
    var x = document.getElementById("myTextarea").value;
    document.getElementById("myProgress").value = x;
}
function myFunction2() {
    var x = document.getElementById("myTextarea2").value;
    document.getElementById("myProgress").max = x;
}
</script>
</body>
</html>

how to save input field data to text file without flushing out the textboxes

1 Answers1