As the title says, this is one hell of a complex form and took David in the forum hours to build (so hats off to David).
You will need to right click on this page and view the source, then copy ALL of the page content and paste into your html editor.
What David has done is to use a calendar script for the user to book a start and finish date, then using the dropdown script reduce the variables shown by placing them under a higher selection. OK, you're lost, let me show you.
Select your camp area, the next selection of what is available is shown, now choose a different camp area, you see a different selection of sites available - neat huh. The dropdown.js can be modified to suit your needs easily, simply open the script and scroll down to the bottom, you'll see the line:
dynamicSelect("campArea", "campSite"); this line you can modify to suit your dropdowns; let me show you.
On your form you will have for example: select id="campArea" name="campArea" as we have, then we have the options as for example: option value="The Great Lakes" anyone chosing this option is only shown matching entries from the second selection select id="campSite" name="campSite" that match the class - class="The Great Lakes. So if your first dropdown is for example color and the second dropdown shade, then you'd use: dynamicSelect("color", "shade"); got it?
Both of the above features are available from the page: Mals Forms
After the user has chosen their dates and camp area/site, we have all of the additional options. This is where the above script from line 20-278 (area) comes into play.
Each area of the script above for the additional options has for example:
if (document.myForm.addPadding.value>'') {
tmpField=document.myForm.addPadding.value;
tmpArray = tmpField.split(':');
tmpDescription+='{br}'+tmpArray[0];
tmpPrice+=parseInt(tmpArray[1]);
}
to modify one of these script areas to suit your form, simply change the lines document.myForm.addPadding.value to your select name for example: select name="addPadding" onchange="sumFields();"
I'm sure that looking down this page you'll be able to see how easy it is to implement this form to suit the one you're designing.
You will need these files, the calendar script and the dropdown script. Right click on this link and 'save as', unzip and extract the files into the same folder as the page you're building. Click to Download
Here's the form, have fun...