473,408 Members | 2,030 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,408 software developers and data experts.

Using Javascript to alter a HTML hidden input value

2
Hey everyone!

First of all I'd like to say that I did my best to look for any other relevant posts. The best I found was this interesting thread.. http://bytes.com/forum/thread594982.html

If it answered my question I am just to stupid to realize it I would like to apologize in advance. This is my very first attempt at using Javascript so any help at all is greatly appreciated. I read the W3Schools Tutorial on Javascript so that and some form posts are the extent of my JavaScript experience. So lets get into this..

I am building a website which uses a remote shopping cart service to handle E-Commerce. There is a small app used to enter product information (such as price, weight, etc.). The program then outputs either an HTML link with the product information within the URL or a form button with the product information within hidden input fields.

This system works great and is actually rather clever. The problem is that there is no support for product attributes. The company the website is for creates products in multiple species of wood. The customer must be able to select which species of wood they would like their item to be. To solve this problem I created a selection box which allows the user to choose a species.

This is where the JavaScript problem comes in. I wanted to create a script which would, on the click of the button, read the species selection value from the selection box. From there the script would add the value of the selection box to the Name value of the button. This, to me at least, seems to be a very simple solution to the problem. However, because of my inexperience with JavaScript I have had a tough time. Here is what I have so far.



[HTML]<form name="order" action="http://ww11.aitsafe.com/cf/add.cfm" method="post">

<p class="SubDisplay2">

<input type="hidden" name="userid" value="XXXXXXXXXX">

<input type="hidden" name="product" value="NC-05">

<input type="hidden" name="price" value="490" >

<input type="hidden" name="return" value="">

<input type="image" onclick= ItemAttributeColor() src="/Images/Links/AddToCart1.jpg" height="60" width="200" Alt="Add to Cart">

<select name="color" >
<option value=" BB"> Bubinga </option>
<option value=" BD"> Birdseye Maple</option>
<option value=" CA"> Canary </option>
<option value=" CU"> Curly Maple</option>
<option value=" CH"> Cherry</option>
</select>
</p>
</form>

[/HTML]

I need to be able to use this script on dozens of pages so I have referenced it as an external file in the <head> section as follows.



[HTML]<script type="text/javascript" src="Color.js"></script>
[/HTML]



The actual Javascript which is named Color.js is as follows.





Expand|Select|Wrap|Line Numbers
  1. function ItemAttributeColor()
  2.  
  3.   var itemName = order.product.value;
  4.   var itemColor = order.color.value;
  5.   order.product.value =itemName+itemColor;
  6.  
  7. }
  8.  

I am fairly confident that I totally slaughtered this language. However, I would like to learn more and use it more frequently so that I can continue to build my knowledge in the web design field. Thank you for any help that any of you can offer. If I left anything out please tell me so I can give you as much information as I can.
Aug 15 '08 #1
3 9852
acoder
16,027 Expert Mod 8TB
You have to properly reference elements to access them and the best way would be via ID. Give both the hidden input field and the select element unique IDs, then use something like the following:
Expand|Select|Wrap|Line Numbers
  1.   var itemColor = document.getElementById("color").value;
  2.   document.getElementById("product").value += itemColor;
+= is short for val = val + ...
Aug 17 '08 #2
zac540
2
Thank you! I got it to work right away and now its full steam ahead to complete this project. Thank you again for your help!
Aug 18 '08 #3
acoder
16,027 Expert Mod 8TB
You're welcome. Glad to help :) Post again should you have any more questions.
Aug 18 '08 #4

Sign in to post your reply or Sign up for a free account.

Similar topics

7
by: NewbieJon | last post by:
I am attempting to send the variable "sComputerName" from my ActiveX script to "GetInfo.asp" using javascript. (Having been advised this is the way to get my ActiveX variable into my ASP script) ...
1
by: ratnakarp | last post by:
Hi, I have a search text box. The user enters the value in the text box and click on enter button. In code behind on button click i'm writing the code to get the values from the database and...
14
by: Rich | last post by:
I am converting my enterprise solution from VS 2003 (.NET v1.1.4322) to VS 2005 (.NET v2.0.50727). The entire solution uses serveral technologies - Windows Server 2003 (AD, SQL Server 2000, IIS,...
4
by: Greg | last post by:
I'm guessing the problem I'm having has something to do with Master Pages or DetailsView because the exact same code works fine on a page without a Master Page and DetailsView controls. The...
2
by: rpjd | last post by:
I am trying to submit entries in a form to a database. I am using " within my submission form and $_POST I am getting the connection to the database but I my script is not executing,...
3
by: nigelesquire | last post by:
Please help! I'm trying to clone and delete multiple rows with JavaScript. I need two delete buttons that work...! I only have one for now, but it's not working properly, the output count is...
5
by: thatcollegeguy | last post by:
Below are my 3php and 2js files. I create a table using ajax/php and then want to change the values in the tables add(+ number for teamid) id's for each specific td in the table. I don't know...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.