Retain inputs

I've tried searching on how do you "retain" a text/number when you click on the submit button. Can someone help me out?

Eg.

Currently, when I type "Soccer, Baseball, Tennis" in the input boxes (X-Axis) and click submit, they return back to their original name of "Q1, Q2, Q3".

How do I ensure that the inputs remain intact? I hope you get what i mean

 

You have a few options, basically:

- Using plain JavaScript and not switching pages
- Using cookies and JavaScript (rather unreliable, and to be used only for "short-term memory")
- Using server side scripting (ex: PHP)

But what to choose entirely depends on what you want to do with the values. Do you want to remember them over the long run, or just for a quick computation?

 

I was thinking of JavaScript .. How do I go about it? I've read multiple sites and I still can't get it. Do you have any link which might be simple for a beginner to understand?

 

Unfortunately I learned JavaScript basics 10 years ago, so my beginner links are not so up to date

But for your first question, what you need to understand is that JavaScript (without cookies or more advanced coding involving the server) only allows you to remember information while the page is loaded. That information is lost when the visitor goes to another page (as when you press a submit button).

Using cookies, you'll be able to remember information a bit longer, by storing a small piece of information on the visitor's computer. (It won't work for those who disable cookies, though: that's why I said they're unreliable) You can set cookies using JavaScript instructions.

Good luck with your learning.

---

EDIT: this tutorial seems well structured and easy enough to follow if you've never done programming:
http://www.w3schools.com/js/js_intro.asp

But perhaps you'll feel this is a bit frustrating since it only shows you how to manipulate variables (rather abstract), not how to manipulate actual elements in the page. But when you've gone through the programming basics of this tutorial, it'll be easier to understand how to access page elements from your scripts. For example, here's something about manipulating (changing values etc.) forms:

http://studiozero.proboards44.com/index.cgi?board=codetuts&action=display&thread=2090

Basically you access page elements as JavaScript variables and objects that already exist an represent those elements. See this URL for the most important ones:
http://www.w3schools.com/js/js_obj_htmldom.asp

Much further in the tutorial there's something about cookies, which might interest you for your project:
http://www.w3schools.com/js/js_cookies.asp

 

indeed - if you do a submit with a page reload, cookies via JS is the only way (if you want to stick to JS that is).

I don't see why you cant have something like:
<input type="text" name="q1" value="<?=$_POST['q1']?>" />

in an ideal world, you vet the values first, so something like:

$q1 = (is_set($_POST['q1']) ? mysql_escape_string(trim($_POST['q1'])) : "Q1";
...
<input type="text" name="q1" value="<?=$q1?>" />

PHP:

if you use ajax to submit then you won't have to do anything as the values will retain what you last typed in them and there won't be a page reload at all.

good luck