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.

This will probably be a little messy. Throughout this thread the code has changed a bit and I've done my work on several computers (so I was updating an older version that was on this PC). Also, the biggest thing I didn't want to deal with was the HTML/formatting of this form. So with that aside, understand this code works, but cannot be directly copied into your page as it'll likely break something. But if you're careful, you can take out the parts and place them as you see fit. As long as the core of this is on your page and the script is the same, it should work.

This is pretty simple overall, but to explain (so you know what you're getting and what to expect), this has a dropdown/select element at the top. When you change this, a new function will show/hide the number items (currently set at a max of 3). Each 'item' display includes a width, length and totalcost field. Each of these items functions independently, with their own values and prices. The tooling and options are at the top, but not part of any specific item (so the value is applied to all items). The grand total calculates the total based on which items are currently visible/available.

Again, be careful when adding this code. I didn't copy your entire form so the actual HTML part needs to be inserted as you feel it should be placed on your form. The javascript can be copied directly with no issues.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

What are you using to edit this page or upload your code? There are a bunch of <p> tags (opening and closing) inside of the javascript. This is causing an error (syntax), thus none of the javascript can run, so things like totaling and showing/hiding items won't work.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

The script will automatically hide the additional fields, however you are currently loading the script (calculatornew1.js) before the HTML of the form is loaded (thus it hits an error as the <select> element doesn't exist yet.

To be fair, in the name of standards the code should be able to adapt to such situations so there is one line that should be changed to fix this on the script's end. Change:

That should fix the issue of not hiding the extra items when the page loads. I feel I should also mention that it's generally a good idea to include javascript files at the end of your document. When a script file is loaded, unless the async property is set to true, the page will stop loading all other data until the script has finished loading. Thus scripts included in the <head> or above any content tend to be a bad idea logically, as it can slow down load times (while generally unnoticeable, it should still be avoided for the sake of standards).

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

Actually when I moved the script down on the page it did only show 1 when the page loaded thanks for that.
OK hopefully my final question (I do appreciate your help)
I have the calculation working thanks to you and when I add the drop down code to the page with working calculations page I cannot get both to work.

On your 'combined' page (http://www.webcrawldesigns.com/dct/order-form/) I'm still seeing <p> tags inside of the javascript. I assume this is why the script doesn't appear to be working on that page. Try removing those tags from the script and see if that fixes the issue.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

The part of that script that runs to restore any saved values is referencing 'document.forms[1]' but currently there is only one form on the page now so that should be updated to 'document.forms[0]' and everything should be working then.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

Thanks that did it.. I notice that when I change the selection from tooling to notooling the total cost doesn't change.
Can you take a quick look at this please www.webcrawldesigns.com/dct/order-form

thanks

Some might think you are starting to abuse the generosity of Sup3rkirby.

You should at least look at the code provided and give a guess as to what should or would be changed to accomplish your requirements. Otherwise you will spend the rest of your career like Stella in "A Streetcar Named Desire" always relying on the "generosity of strangers".

Perhaps you have since fixed the issue, but I'm not noticing that problem on the page. Switching between the two tooling options seems to change the price accordingly.

I will note that generally your questions are easy enough to where I don't mind helping, but you should know there is no secret magic behind what I do. Generally when a script doesn't work I open the page where it should be running, press F12 and go to the 'Console' tab. If the script is truly broken I'll see an error that I can link back to a specific line in the script. If there are no errors I know it's more of a logical flaw in the script.

It's an invaluable tool built into modern browsers that can likely help you solve most of the problems you may encounter. For instance, you'll be able to pick up on a number of other errors that are occurring on the page, such as your remember.js file trying to set the value of your 'shipping' field which does not exist.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"