JavaScript - Help Trying To Pass A Hidden Field Through Form

I've inherited this piece and now I'm suppose to add to it. Its basic function currently is when the "Other" option is selected, a hidden text field shows. Now, I need to add when "Athletics" is selected, another hidden select group will show.
I've set up the new Select group already, but not sure how to incorporate it into the already existing script. I've been researching for two days, and hopefully this form will be helpful.


Code:

<select id="Program" name="Program" size="1" onchange="
      $other = document.getElementById('other_program').style;
      $invoice = document.getElementById('invoice');
      if (selectedIndex==6) {
        $other.visibility='visible';
        if ($invoice.value == 'General Fund') $invoice.value='';
      } else {
        $other.visibility='hidden';
        if (selectedIndex==1) {
          $invoice.value='Renegade Fund';
        } else {
          $invoice.value='Please Specify';
        }
      }
      ">
      <option selected="selected" value="Not Selected"> - - Select One - - </option>
      <option value="Athletics">Athletics</option>
      <option value="Drum Line">Drum Line</option>
      <option value="Renegade Fund">Renegade Fund</option>
      <option value="General Scholarships">General Scholarships</option>
      <option value="President's Circle">President's Circle</option>
      <option value="Other">Other</option>
    </select>

    <span id="other_program"><input type="text" id="invoice" name="invoice" size="15" /></span>

    <!-- the following is the new select group ive set up
    <span id="alumni">
        <select id="select-alumni" name="select-alumni" size="1">
            <option selected="selected" value="Not Selected">Yes or No</option>
            <option value="Yes-alumni">Yes</option>
            <option value="Not-alumni">No</option>
        </select>
    </span>
    -->

hi guyz i do have a problem in passing javascript variable to <input type=hidden value="">


here's my code:

<?php
while ($row = mysql_fetch_array($result))
{
?>


<script type="text/javascript">
function viewcodec(){
var randomValueCodec = randomString(5, 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789');
document.getElementById('commentMarkCodeCompCodec-'+<?php echo $row['p_id'];?>).innerHTML = randomValueCodec;
document.getElementById('commentMarkCodeComp-'+<?php echo $row['p_id'];?>).innerHTML = randomValueCodec;

}

</script>
<form action="" method="post" name="postsForms">
<div class="commentBox" align="right" id="commentBox-<?php echo $row['p_id'];?>" <?php echo (($comment_num_row) ? '' :'style="display:none"')?>>

<input type=text id="commentMarkname-<?php echo $row['p_id'];?>" name="commentmarkname" class="commentMarkname" size="35" maxlength="20">
<textarea class="commentMark" id="commentMark-<?php echo $row['p_id'];?>" name="commentmark" cols="60"></textarea>
<input type=text id="commentMarkcode-<?php echo $row['p_id'];?>" name="commentmarkcode" class="commentMarkcode" size="35" maxlength="20">
<br clear="all" />
<span id='commentMarkCodeCompCodec-<?php echo $row['p_id'];?>'><b><script type="text/javascript">viewcodec();</script></b></span>
<input type="hidden" id="commentMarkCodeComp-<?php echo $row['p_id'];?>" name="commentMarkCodeComp" value="">
<br clear="all" />
<br clear="all" />
<a id="SubmitComment" style="float:right" class="small button comment"> Comment</a>
</div>
</form>

<?php
}
?>

I have a simple script connect to a radio button. Based on which option, the matching div appears with a text box - and one with a radio button. If they change their mind and click another radio button, it'll switch to the new div, but keep the content in the old. How do I clear that out?

I looked for a snippet, but they're all for clearing default text in a field when you click it. I want something a little different.

Here's what I'm using:

Code:

<script>
$(document).ready(function() {
    $("div.desc").hide();
    $("input[name$='hear']").click(function() {
        var test = $(this).val();
        $("div.desc").hide();
        $("#" + test).show();
    });
});


</script>

<input type="radio" name="hear" value="dcranch"> DC Ranch Community <br />
<input type="radio" name="hear" value="friend"> From a friend <br />


<div style="display: none;" id="dcranch" class="desc"> <input type="checkbox" value="Yes" name="resident" /> If so, are you a DC Ranch resident? )</div><br />	
<div style="display: none;" id="friend" class="desc"> Name? <input type="text" name="how1" /></div><br />

I have a hidden field whose value is a text string, "xyz". I want to write the value to the page so that the user can see it but not edit it. Can't I just use document.write(form.field.value)? Why isn't it working?

Hey Guys,

I have the following hidden field within a form:

Code:

<input type="hidden" name="test12" value="test12" />

I also have the following function which does something if that field exists:

Code:

if(document.formName.test12.value == "thisdata")
	{
		//do something
	}

The problem I'm having is that if the hidden field doesn't display (which based on conditional logic, sometimes happens), a JS error is thrown on the page. What is the best way to carry out this check effectively without throwing an error if the field does not exist?

Thanks in advance.

Hi,

I was tasked with creating a JavaScript quiz...
I succeeded in doing so but part of the requirement was to use hidden fields for the answers.

Would this be possible using the code I currently have:

Thanks

Code:

<html>
<head>
<script type="text/javascript">
	function valid() 
	{
		cor = "0"
		incor = "0"
		test0 = document.myform.elements[0].value;
		test1 = document.myform.elements[1].value;
		test2 = document.myform.elements[2].value;
		test3 = document.myform.elements[3].value;
		test4 = document.myform.elements[4].value;
		test5 = document.myform.elements[5].value;
		test6 = document.myform.elements[6].value;
		test7 = document.myform.elements[7].value;
		test8 = document.myform.elements[8].value;
		test9 = document.myform.elements[9].value;
		
			if (test0 == "64") 
			{
				alert("Congratulations you got question one correct!");
                    ++cor
			}
				else alert("Sorry, you got question one incorrect!");

	
			if (test1 == "56") 
			{
				alert("Congratulations you got question two correct!");
                    ++cor
			}
				else alert("Sorry, you got question two incorrect!");
			
			if (test2 == "7") 
			{
				alert("Congratulations you got question three correct!");
                    ++cor
			}
				else alert("Sorry, you got question three incorrect!");
				
			if (test3 == "8") 
			{
				alert("Congratulations you got question four correct!");
                    ++cor
			}
				else alert("Sorry, you got question four incorrect!");
				
			if (test4 == "100") 
			{
				alert("Congratulations you got question five correct!");
                    ++cor
			}
				else alert("Sorry, you got question five incorrect!");
				
			if (test5 == "1947") 
			{
				alert("Congratulations you got question six correct!");
                    ++cor
			}
				else alert("Sorry, you got question six incorrect!");
				
			if (test6 == "1") 
			{
				alert("Congratulations you got question seven correct!");
                    ++cor
			}
				else alert("Sorry, you got question seven incorrect!");
				
			if (test7 == "7") 
			{
				alert("Congratulations you got question eight correct!");
                    ++cor
			}
				else alert("Sorry, you got question eight incorrect!");
				
			if (test8 == "132") 
			{
				alert("Congratulations you got question nine correct!");
                    ++cor
			}
				else alert("Sorry, you got question nine incorrect!");
							
			if (test9 == "5280") 
			{
				alert("Congratulations you got question ten correct!");
                    ++cor
			}
				else alert("Sorry, you got question ten incorrect!");
				
				
					
			//else ++incor
				alert("you got " + cor + " right\n You got " + cor/10 * 100 + "% correct!");
	}
</script>
</head>
<body>
<form name="myform">
<table border="1" cellpadding="10">
<tr><td>1. 64 added to what number gives a sum of 128?</td><td><input type="text" name="q1"></td></tr>
<tr><td>2. The product of 8 and 7 is?</td><td><input type="text" name="q2"></td></tr>
<tr><td>3. 35 divided by 5 is:</td><td><input type="text" name="q3"></td></tr>
<tr><td>4. 40 divided by 5 is:</td><td><input type="text" name="q4"></td></tr>
<tr><td>5. What is the area of rectangle that measure 5 by 20?</td><td><input type="text" name="q5"></td></tr>
<tr><td>6. What is 3054 subtracted from 5001?</td><td><input type="text" name="q6"></td></tr>
<tr><td>7. What is the result of 5 x 8-39?</td><td><input type="text" name="q7"></td></tr>
<tr><td>8. What is the binary number 111 in decimal?</td><td><input type="text" name="q8"></td></tr>
<tr><td>9. The sum of 33 and 44 and 55 is:</td><td><input type="text" name="q9"></td></tr>
<tr><td>10. How many feet in a mile?</td><td><input type="text" name="q10"></td></tr>
<tr><td><input type="button" onClick="valid()" value="score"></td><td><input type="reset"></td></tr>
</form>
</table>

</body>
</html>

I have a script where I move randomly users from one multiple selectfield to another and that part works perfectly, but...

When I want to submit the form I don't get any users passed along, course they are not "selected". I have then read around on the net and I need to create an elemet with a hidden input field where all the randomly selected users is inserted to with comma separation, but dont know how?!?!

This is what I got:
Code:

function randomusers(){
	
	var given = 3, used = {}, randnum, opts = $('#select1 option'), olen = opts.length;
		function ran() { // generate a unique random number
		  randnum = Math.floor(Math.random() * olen);
		  return used['u'+randnum] ? ran() : randnum;
		}
		for (var i = 0; i < given; i++) { // get the correct quantity of randoms
		  used['u'+ran()] = true;
		}
		opts.filter(function(index) { // remove all options that are not one of the randoms
		  return !!used['u'+index];
		}).appendTo('#select2');
	
}

I have tryied to insert this: appendTo('#select2' + '<input type="hidden" name="test[]" value="" />'); but that didn't seem right...

Please help :-)

Okay, new to this magical thing called Javascript and LOVING it. Don't know how I avoided it all these years.

Running into a stupid issue and I am sure it is just something I am missing. I have a hidden field in my page with the default value of HELLO. I am trying to make a change based on the default value, but I obviously am doing something wrong because it won't display my hidden field value. Any help would be greatly appreciated.

Code:

<html>
<head>
<script>
	function checkForm()
		{
			var testing = document.getElementById("testing").value;
			document.getElementById("result").innerHTML = testing;
		}
</script>
</head>
<body>
	<input type="hidden" name="testing" value="HELLO" />
	<input type="submit" value="submit" onClick="checkForm()"; />
	<div id="result"></div>
</body>
</html>

Hi, i have a page with lots of checkboxes and hidden fields. When i tick a checkbox i want it to give the hidden filed a value. But give it no value if it is not ticked. For every checkbox i have a hidden field is with it. Both the checkbox and the hidden field send information. I have used some js scripts but they don't seem to work with more than one checkbox. Please can you help.

Example:

<input type="checkbox" name="box1" id="box1" value="4th July 2009,">
<input type="hidden" name="price1" id="price1" value="0">

So when box1 is ticked it then gives price1 a value. But if not ticked then the value remains at 0. I want it to give a value of 699.
There will be about 100 checkboxes and hidden fields on the page. Also onclick behaviours do not work because it may still send the information if the checkbox is not checked.

So for the next checkbox and hidden field i use box2 and price2.

Thanks for your help.

I need for the form to do the following:
when age is greater than or equal to 65 enter "yes" in the hidden field
when age is less than 65 enter "no" in the hidden filed
return true

Create a page processAge.htm that
Writes the message on the page
Hi name. At age # you may retire.
or
Hi name. At age # you are not ready to retire. Get to work.
name is the name entered on the form.
# is the age entered on the form.

Java:
Code:

<script type="text/javascript">
/* <![CDATA[ */
function validateSubmission() {
  var retValue = true;
  if (document.forms[0].name.value == "") {
      window.alert("You did not fill in one of the following required fields: Name or Age.");
      retValue = false;
      }
}
function checkForNumber(fieldValue) {
  var numberCheck = isNaN(fieldValue);
  if (numberCheck == true) {
    window.alert("You must enter a numeric value!");
    return false;
    }
} 
/* ]]> */
</script>

Body:
Code:

<form action="processAge.htm" method="get" onsubmit="makeList(); return validateSubmission(); ">
<table frame="border" rules="cols" >
<tr>
<td valign="top">
<h2>Retirement</h2>
<p>Name<br />
<input type="text" name="name" size="40" /></p>
<p>Age<br />
<input type="text" name="age" size="40" onchange="return checkForNumber(this.value);" /></p>
<p style="text-align: center"><input type="submit" value="Send" /><input type="reset" />
<input type="hidden" name="Retirement" /></p>
</td></tr>
</table>
</form>

Process Page:
Code:

<script type="text/javascript">
/* <![CDATA[ */
document.write("<h1>Your form has been submitted!</h1><h2>You entered the following data:</h2>");
var formData = location.search;
formData = formData.substring(1, formData.length);
while (formData.indexOf("+") != -1) {
  formData = formData.replace("+", " ");
}
formData = unescape(formData);
var formArray = formData.split("&");
for (var i=0; i < formArray.length; ++i) {
  document.writeln(formArray[i] + "<br />");
}
/* ]]> */
</script>

Thanks for any help!

I have a very interesting situation and I'm just looking for ideas at the moment. I have a webpage for insurance agents that the agent will login and then enter some insured information.

There is a field named "agentnumber" that is on the form, but is hidden by a display:none. The field is set from the username of the person who logs in whenever the form loads the first time. The form will save automatically when the user leaves the page.

I am experiencing a weird issue that every now and then, the agentnumber field is getting saved with incorrect data. After discussing it with the agent, it is being saved with the agentnumber of the agent from other companies, not from the my website. Just looking for any ideas on what may be happening as I thought browser security would prevent cross site javascript. The users are using IE 7 & IE 8. Any help would be appreciated as I'm not even sure what to look for.

Hi all, I'm a beginner in JavaScript can someone please help me to resolve this issue and thanks in advance for your help!

What I'm trying to do is..

When you select multiple <div> get the value of each one and save in separate hidden fields accordingly.

What needs to happen is...

Click div 1 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2

Click div 2 --> if hidden field1 value is "none", save there, else check hidden field 2 if that's "none" save in hidden field 2

Here's what I've come up with so far (currently I'm using JQuery)

The problem with this is that no matter what div I click in which order it only updates the 1st hidden field

Code:

<div id="click1" name="click1" value="123" onclick="abc()"/>Click 1</div>
<div id="click2" name="click2" value="225" onclick="def()"/>Click 2</div>

<input id="passenger_1" name="passenger_1" type="hidden" value="none" />
<input id="passenger_2" name="passenger_2" type="hidden" value="none" />

<script>
function abc() {
var pasvalue = $('#click1').attr('value');
var pas1_value = $('#passenger_1').attr('value');
var pas2_value = $('#passenger_2').attr('value');
if(pas1_value == "none"){
	$('#passenger_1').attr('value', pasvalue);
}else if (pas2_value == "none"){
	$('#passenger_2').attr('value', pasvalue);
}}

function def() {
var pasvalue = $('#click2').attr('value');
var pas1_value = $('#passenger_1').attr('value');
var pas2_value = $('#passenger_2').attr('value');
if(pas1_value == "none"){
	$('#passenger_1').attr('value', pasvalue);
}else if (pas2_value == "none"){
	$('#passenger_2').attr('value', pasvalue);
}}
</script>

my code is below
what i want this to do is take the x_cityid and add it to teh hidden field with the id of citiesid (I will do an ajax call before this but my simple javascript is not working)

what am i doing wrong?

function addtocitylist() {
var x_cityid = document.getElementById('x_cityid');
var x_areaid = document.getElementById('x_areaid');
var scitiesid=document.getElementById('citiesid');
var areasid = document.getElementById('areasid');

if (!scitiesid) {
scitiesid.value = x_cityid;
} else {
scitiesid.value = scitiesid + ',' + x_cityid;
}
scitiesid.value = scitiesid ;


alert(scitiesid);
}

I thought this would have been fairly simple but it appears the onchange event isn't triggered when a hidden field is populated by other javascript without user input.

I have a simple search box and autocomplete/suggestion ajax thingie going on.

What I want to do is have my "Go" submit button disbled until AFTER a user has populated the hidden field "cid". A user populates this field automatically when they click on a suggested option from the ajax autocomplete doofer.

Here's what I've tried at the moment but failed on.

Code:

<form action="index.php" method="GET" name="qsform" id="qsform">
<input type="hidden" name="p" id="p" value="compdetails" style="border:1px solid #000000;" />
<input type="text" name="quicksearch" id="quicksearch" value="Find Company" style="border:1px solid #000000;" onFocus="clearText(this)" onBlur="clearText(this)" />
<input type="hidden" name="cid" id="cid" value="" style="border:1px solid #000000;" />&nbsp;
<input type="submit" name="go" id="go" value="Go" disabled="true" onmouseover="if (document.qsform.cid.value!='') { document.qsform.go.disabled=false; }" />
</form>

Hi,

Is there anyone who could help me figure out how to Change a Hidden Fields Name based on selected option. The hidden fields name is sent off and I need to change the name depending on what option they select.
For if they select MyList the hidden field name needs to be SelectLists[40] or if they select testlist the hidden field name needs to be SelectLists[41].

This is probably way, way off but I've done this and it doesn't work.

Any help would be greatly appreciated, thanks.


<script language="JavaScript">
function changelist() {
//here we assign the value of the hidden input to x
x=eval(document.getElementByName("SelectLists[40]");

if(document.getElementById("SelectLists[40]").selected=true
x=SelectLists[40]

else(document.getElementById("SelectLists[41]").selected=true
x=SelectLists[41]

else(document.getElementById("SelectLists[42]").selected=true
x=SelectLists[42]

//now we assign the new value to the input
document.getElementById("theHiddenInput").name=x;

//and now we test
alert(document.getElementById("theHiddenInput").name)


}
</script>





<input type="hidden" id="theHiddenInput" name="SelectLists[40]" value="Yes">
<select class="inpBox" style="width: 287px" name='mailinglist' id="lists" onchange="changelist()">
<option value="SelectLists[40]" name="SelectLists[40]" id="SelectLists[40]">MyList</option>
<option value="SelectLists[41]" name="SelectLists[41]" id="SelectLists[41]">testlist</option>
<option value="SelectLists[42]" name="SelectLists[42]" id="SelectLists[42]">testlist2</option>