0

I have code where users input some text, hit Post and text shows on the page, but when I reload it the text is lost. Do I need PHP for this?

$(".form-input").submit(function(e) {
  e.preventDefault();
  var value = $(".div-input").val();
  $("<div class='outputs'>" + value + "</div>").appendTo($(".output"));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form class="form-input">
  <input class="div-input">
  <button type="submit">Submit</button>
</form>
<div class="output"></div>
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
Regrets
  • 55
  • 7
  • 4
    JS and HTML is stateless. This basically means that any changes you make during the page lifecycle are lost when it is reloaded. To store state you can use sessionStorage, localStorage, cookies, or a server side database. Which you is right for you depends on how long you want to hold the data and how secure it needs to be. – Rory McCrossan Oct 19 '18 at 10:40
  • It doesnt have to be much secure, its going to be simple text input, so how can I do it with Storage or Cookies, if you can maybe help me or give me some link where I can read it – Regrets Oct 19 '18 at 10:44
  • you can already easily find lots of tutorials about any of these tehnologies - localstorage, sessionstorage, cookies, or PHP/MySQL if you search online. You don't need us to google it for you. – ADyson Oct 19 '18 at 10:46
  • Try this: https://stackoverflow.com/questions/2010892/storing-objects-in-html5-localstorage – A. Meshu Oct 19 '18 at 11:32

1 Answers1

0

Definitely you need a backend(PHP or any other). The value stored in your javascript will be cleared once you refresh the page. So, on posting you need to save the data in the backend server if you need it later. You can retrieve the data from the server and once the page reload. If you don't want to use any backend server, you might consider the option of storing the data in cookies or browser's local storage.

MonkeyScript
  • 4,776
  • 1
  • 11
  • 28