?
Solved

Can't access my hidden form field in my javascript

Posted on 2008-10-23
2
Medium Priority
?
467 Views
Last Modified: 2012-05-05
I have a form that when submitted, I want to set the hidden fields using javascript.  The fields are going to contain the text from drop down menus.  I can't set the value of the drop downs to the text because I need different information for the value.

I've included the form definition and the code from the Javascript function.  In the Javascript function, the first alert shows me the text (Project Name 1), the second alert shows me the text (Program 1), and the third alert shows me the value in the input text field (some text here).  The last alert is never shown.  I know the hidden fields are defined because when the form is posted, I am able to pull the value from them.  They just don't contain the value I want (contain the initial value).

If anyone can point out where my mistake is I would appreciate it.
Form definition
-----------------------------------------------------------------------
<form name="ProjectsForm" id="ProjectsForm" method="post" action="">
<input type="hidden" id="projectname" name="projectname" value="Error project name">
<input type="hidden" id="programname" name="programname" value="Error program name">
<select name="Projects" id="Projects">
<option>Select Project Survey</option>
<option value="1">Project Name 1</option>
</select>
<input type="text" id="test" name="test" value="some text here"></input>
<select name="surveys" id="surveys">
<option>Select Program</option>
<option value="34">Program 1</option>
</select>
<input type="text" id="test" name="test" value="some text here"></input>
<input type="submit"  onClick="setHiddenValues()" name="Build" value="Build Survey">
</form>
 
 
Javascript Function in HEAD Section
------------------------------------------------------------------------
function setHiddenValues()
{
	var w=document.getElementById("Projects").selectedIndex;
	var x=document.getElementById("Projects");
	alert(x.options[w].text);
	
	w=document.getElementById("surveys").selectedIndex;
	x=document.getElementById("surveys");
	alert(x.options[w].text);
	alert(document.getElementById("test").value);
	alert(document.getElementById("projectname").value);
	return true;
}

Open in new window

0
Comment
Question by:dyarosh
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 7

Accepted Solution

by:
bluV11t earned 2000 total points
ID: 22787872
Just tested the code in both IE and FF and works fine here...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>test</title>
<script type="text/javascript">
function setHiddenValues()
{
        var w=document.getElementById("Projects").selectedIndex;
        var x=document.getElementById("Projects");
        alert(x.options[w].text);
        
        w=document.getElementById("surveys").selectedIndex;
        x=document.getElementById("surveys");
        alert(x.options[w].text);
        alert(document.getElementById("test").value);
        alert(document.getElementById("projectname").value);
        return true;
} 
 </script>
 </head>
 <body>
<form id="ProjectsForm" method="post" action="">
<input type="hidden" id="projectname" name="projectname" value="Error project name" />
<input type="hidden" id="programname" name="programname" value="Error program name" />
<select name="Projects" id="Projects">
<option>Select Project Survey</option>
<option value="1">Project Name 1</option>
</select>
<input type="text" id="test" name="test" value="some text here" />
<select name="surveys" id="surveys">
<option>Select Program</option>
<option value="34">Program 1</option>
</select>
<input type="text" id="Text1" name="test" value="some text here" />
<input type="submit" onclick="setHiddenValues()" name="Build" value="Build Survey">
</form>
</body>
</html>

Open in new window

0
 

Author Closing Comment

by:dyarosh
ID: 31509281
I must have had a typo somewhere because when I copied your code everything worked fine.  Thanks for the help.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In my daily work (mainly using ASP.net), I need to write a lot of JavaScript code. One of the most repetitive tasks I do are the jQuery Ajax calls. You know: (CODE) I don't know if for you it's the same, but for me is soooo tedious to write the …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

764 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question