The SitePoint Forums have moved.

You can now find them here.
This forum is now closed to new posts, but you can browse existing content.
You can find out more information about the move and how to open a new account (if necessary) here.
If you get stuck you can get support by emailing forums@sitepoint.com

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.

Still no luck with it, I embedded the script straight into the html page and tried to source it in from a js file, both did not work,

I am trying to set up a form that allows users to purchase canvas prints of various sizes,

I want the form to have input for the customers name, contact number, email address, delivery address, etc ( I want this to be sent when a check out button is pressed)

I also want it to have a seperate form section which has the canvas details (for example drop down menu with all the canvas sizes) an input box which displays the price of the canvas size (the canvas price is stored in the options value tag) and a paypal checkout express button (I want the checkout express button to change depending on the canvas size & price) so if someone selects a 24" by 24" canvas in the drop down menu the page will refresh with the correct paypal checkout button and the price will be displayed in an input box...

You're trying to access the select element with getElementById("option value") which won't work because the string is an invalid identifier. You will need to provide either a valid identifier or use some other technique.

Option 1: Provide a valid identifier

Code html4strict:

<selectname="mydrop"id="mydrop">

Code javascript:

var drop = document.getElementById("mydrop");

Option 2: Access the named element instead

Code javascript:

var drop =this.form.elements['mydrop'];

Once you have access to the select element, what it seems that you're script is trying to do is to update the result-value element when the button is clicked.

Would it not be better to instead do that when the select element is changed? This would mean using an identifier for the form so that the event can more easily be attached to the select element.

When it comes to working with form elements, it's better to have just the one identifier on the form itself and use standard techniques to access named elements. So we can use Option 1 to access the form, and the script technique from Option 2 to access the elements.

To clarify my intentions here, I'm going to assign to the select element an onchange event that will update the price field.