How do I store values entered in a form with a submit button and access them through a javascript function?

Question

Here's my code. There are probably tools online that help figure out this problem, but I can't find anything.

I just want to call a function when i click submit that will display a table. For now though, it's OK to display text because I just want to figure out how to make the function work at this point.

Any insight into the problem, or possible solutions very much appreciated. Thanks.

Does a member of your household have a disability?

Yes
No

Answer 1

It appears you are creating a JavaScript (client-side) application with no server-side backup. My first suggestion would be to employ a server-side technology (PHP, ASP/.NET, JSP, CGI, whatever) and use it to generate your table instead of JavaScript because it would probably be easier to do what you want that way (it's a better tool for that particular job). However, your question was about JavaScript so I'll try to help you with that.



Normally, I would suggest that in your form tag, you add an onsubmit event handler instead of an onclick event in your submit button.

Note:



...form fields go here



instead of:





However, you don't even need a submit button in your example because the form results aren't submitted to a server. You could, as someone suggested, use an instead of . It is important that you place tags within your

tags (your submit button is outside of the tag). Then, you should pass a reference to your form either through the onsubmit event of the form (see above) or by doing this:





This way, your function (in your case, makeTable) can accept a parameter which contains the reference to the form and its elements. Here's what the new function should look like:







Notice the function parameter "f"? That is the reference to the form that was passed in as "this.form" in the button's onclick event. With a reference to the form, you can access the elements contained in it. Radio buttons are in an indexed collection (array) so you can access them using subscripts: f.disability[ 0 ] is the first radio button while f.disability[ 1 ] is the second radio button. Checkboxes and radio buttons have a "checked" property which is true if the button is checked and false if it's unchecked.



My final suggestion would be for you to pick up a JavaScript book. I suggest:

JavaScript: The Definitive Guide

and

JavaScript: The Good Parts



On a side note, you should avoid using the document.write() method for many reasons. In fact, skip it completely and learn how to use the newer and better DOM methods starting with document.getElementById().



Good luck.

Answer 2

You would use input type of button instead of submit.

input type="button" onclick = "makeTable()"...

Answer 3

You have to use span