How to display values in text area based on check boxes and radio buttons?

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

How to display values in text area based on check boxes and radio buttons?

Hello, I am trying to make a basic pizza order form and I am stuck. I want to be able to display the pizza size, toppings, and total price based on what the user checks in the check boxes and radio buttons.

The black text area should look something like this after the user hits submit:

With this line :
document.getElementById("opta").innerHTML = type+newline+"Toppings:"+newline+toppings+newline+"Price - $"+sum;

The textarea has the id "opta" so you get the element like document.getElementById("opta") .Then you edit it's innerhtml (whatever is between the <textarea> and </textarea>) by giving a new string to the value element.innerHTML (or document.getElementById("opta").innerHTML in this case).
So you basically call a function by clicking the button that checks which checkboxes and radioboxes are checked, creates a string (or multiple strings with my example above) and then sends this strings to replace anything inside the textarea.
Just one thing about the textarea, you can't put html code in it because it will show it as any other text, you may have to use ascii codes for some things like new line etc.

I see, it didn't keep the ascii codes for next line and ruined the javascript. Well since I can't post it directly in the forum because it automatically makes it a new line, you will have to fix the line 18 :
var newline="
";
as
var newline="&# 13 ;";
but without the space between the # and 1 as well as between the 3 and ;
Then it should work properly.

I see, it didn't keep the ascii codes for next line and ruined the javascript. Well since I can't post it directly in the forum because it automatically makes it a new line, you will have to fix the line 18 :
var newline="
";
as
var newline="&# 13 ;";
but without the space between the # and 1 as well as between the 3 and ;
Then it should work properly.

*Edit* I had to add back in the "onfocus="this.blur()"" event, and now its working, THANK YOU!

Yea I just tested it a bit myself and it seems that clear() isn't working with that name. But if you change the function's name to something like cleanit() it will work, change it into that in both the javascript and the button's listener.

Awesome, it works now. Thank you so much. Do you know how to make it so if I check "cheese only" it checks to make sure no other checkboxes are checked, and if they are, it displays an alert box and unchecks the other boxes?

Sure, for that we will need an other function that will be called when you click the checkbox with cheese. It will also tell the function weather or not it's checked (so it will disable them when you click to check and re-enable them when you click to uncheck it) :

Sorry I didn't see the edit you made in time, check if the way I posted here works as well enough, if you insist to have the alert it's easy to add but you should know alerts are best to be avoided since they usually cause discomfort to your visitors.