Submitting data- two forms on one webpage

[mojanda]

Hello,

I had some great help from "theniteowl" the other day regarding some javascipt and am hoping he/she or someone else can assist me with this perplexing issue.

I'm working on an online registration form for a summer camp. It's one BIG form. At the bottom there are elements (radio buttons, checkboxes) that take the selected elements, calculates them, and places them in a textbox "Total", "Deposit", "Balance". A javascript does the math.

My problem is that when ANY other radio buttons or checkboxs are selected (eg- O Male O Female), the values for program costs don't appear when selected. There's some conflict. I thought about have two forms... one for the personal data, and one for the cost(numerical) data. However, it seems I can't have one SUBMIT button to cover both forms.

So, my questions are:
1)Can I have one SUBMIT button to send the data from two forms on the same webpage
2)Can I change the variables in the javascript to read ONLY those form elements that requires it... if so... how?

Thanks!
Peter

http://www.zoocamp.net/register2006.html

 

[kaht]

1) no

2) You'll need to provide what code you have so far (copy the output from the "view source" of the page and paste it here, or better yet provide a link to the specific page) so that we can tell you what to change.

[small]btw, I see you have a link in your signature, is that the link of the page that is screwing up?[/small]

-kaht

[small] <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <B> <P> <.</B>[/small]
[small](He's back)[/small]

 

[BillyRayPreachersSon]

There are many ways of doing this. Probably the least-hassle for you is to check whether the value associated with the radio button / checkbox is numeric, and if not, skip that element.

Of course, you need to ensure that none of your radio or checkbox fields (other than those related to the total) have numeric values.

Try this for size as a replacement calculateTotal function:

function calculateTotal() {
	var total = deposit = balance=0;
	var el = document.forms['zoocampform'].elements;
	for (var x=0; x<el.length; x++) {
		if (el[x].checked && !isNaN(el[x].value)) {
			total += parseInt(el[x].value, 10);
			if (el[x].name == "Session") deposit = (el[x].value / 650) * 100;
		}
	}
	total = (total * 0.03) + (total * 0.07) + total;
	balance = total - deposit ;
	el['total'].value = formatCurrency((total > 0) ? total : 0);
	el['deposit'].value = formatCurrency((deposit > 0) ? deposit : 0);
	el['balance'].value = formatCurrency((balance > 0) ? balance : 0);
}

Hope this helps,
Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[BillyRayPreachersSon]

Incidentally, some things I would change with your form (call me a pedant ;-))...

"Middle Name". Some people have multiple middle names, so I would put "Middle Name(s)".

"Age while at Camp". I would change this to be "Age at start of camp", as the person may have a birthday while there, and there is no facility to enter multiple ages. You might consider moving the "Will the camper have their Birthday while at Safari Zoo Camp?" field from further down the page to near the "Age" field, too.

"Guardians First Name" - missing an apostrophe. That aside, this is inconsistent with the "Mother's Information" and "Father's Information" section. For consistency, surely this should be a "Guardian's Information" section?

Would listing someone as vegetarian really be considered an "Allergy and Reaction"? I would put this elsewhere.

You link to part 2 ("However, a deposit ($100.00 per camper week) with the signed form in PART 2 must be..."), but the link does not submit the form. Some people may be confused about this, leading to possible data loss (if they click it, and their browser doesn't remember the form fields when they go back). I would remove the link, and let people see part 2 only when the form has been submitted.

Dan

[tt]Dan's Page [blue]@[/blue] Code Couch

http://www.codecouch.com/dan/

[/tt]

 

[theniteowl]

mojanda,
The last script I sent you just read every single form element on the page and tested if it had a checked property and if so added it's value to the total.
It was actually based on a function that BillyRayPreachersSon had posted in a previous message (thanks Dan).
It seemed the easiest way to calculate all fields on the page given your question and not knowing how many other fields might be added.

It is easy enough to make the code target specific fields and groups of fields though.
You only have two radio button groups and two individual checkboxes so the following code should work well.
When fields have the same name, when you reference them you do it as an array so I get a reference to Session which is an array of all the Session radio buttons then I loop through the array testing each button to see if it is checked and if it is then I add that buttons value to total. I then do the same thing with the Supervision group.

The discount checkboxes are not a group, just individual checkboxes so I then test each one individually to see if it is checked.
Do you really want to allow both boxes to be checked or would this be better as an radio group also?

Here is the updated function.

function calculateTotal() {
  var total=0;
  var Session = document.forms['selectionForm'].Session;
  var Supervision = document.forms['selectionForm'].Supervision;
  for (var x=0;x<Session.length;x++) {
    if (Session[x].checked)
      total+=Session[x].value-0;
  }
  for (var x=0;x<Supervision.length;x++) {
    if (Supervision[x].checked)
      total+=Supervision[x].value-0;
  }
  if (document.forms['selectionForm'].Discount_one.checked)
    total+=document.forms['selectionForm'].Discount_one.value-0;
  if (document.forms['selectionForm'].Discount_two.checked)
    total+=document.forms['selectionForm'].Discount_two.value-0;

  document.selectionForm.total.value = formatCurrency((total > 0)?total:0);
}

BTW, the form looks great. I would suggest a bit of padding for the border at the bottom of each section for consistency but I suspect that is what you intended for it anyway.


Stamp out, eliminate and abolish redundancy!

 

[mojanda]

Hi everyone,

Thanks again for your help! Dan, I ended up using your code because I knew none of the other checkbox's or radio fields had numerical data. The code you wrote plugged in nicely. I also appreciate your thoughts about the form and have made changes accordingly...though I had to look up "pedant" in the dictionary

thenightowl... again... thank so much again! If I knew this forum existed earlier I would have saved DAYS (MONTHS!) of programming time in the past. I can' express my gratitude enough. If you're ever in Orono, Ontario, feel free to stop in at Jungle Cat World and I'll be sure to give you a free tour!

Cheers,

Peter