JavaScript - Making A Search Form Where Inputs Only Appear On Certain Selection

I have many radio buttons associated with questions on a page with Yes/No options. Depending on if Yes or No is selected (varies with question), I need to prevent the user from going off of the page and somehow "mark" the questions that are answered "incorrectly/not preferred".

I could probably put validation on each individual radio button and display a message when going off the page, but I'm looking to make this more dynamic. One idea I had was to put a function on each radio button's onChange event and build an array using .push() to construct the array with all the radio button IDs that are answered incorrectly. I ran into problems when deleting from the array when the radio button was changed back to a correct response though.

What may be best is to somehow indicate which radio buttons need looked at when leaving the page and then run a function or case statement over all the radio buttons to build an object? I'm not sure what approach to take.

Any thoughts are appreciated. Thanks.

I have a JavaScript that remembers the values of a form by creating cookies for each input element onblur.

I cannot figure out though how to exclude one input field from being remember.

It would be document.getElementsByTagName('input')[15]

Every time I try to add an if/else statement in using that line, the script doesn't work altogether.

Code:

window.onload = function() {  
	rememberFormInputs('rma', 'input-');
	}

/** 
* Set a cookie 
* @param string cookie name 
* @param string cookie value 
* @param string cookie expiration counter in days 
* @param string cookie path 
* @param string cookie domain 
* @param bool secure? 
*/

function setCookie(name, value, expires, path, domain, secure) {  
	var today = new Date();  
	today.setTime(today.getTime());  
	if (expires) {  
		expires = expires * 1000 * 60 * 60 * 24;  
		}  
	var expires_date = new Date(today.getTime() + (expires));  
	document.cookie = name+"="+escape(value) +  
		((expires) ? ";expires="+expires_date.toGMTString() : "") +  
		((path) ? ";path=" + path : "") +  
		((domain) ? ";domain=" + domain : "") +  
		((secure) ? ";secure" : "");  
	}
	
/** 
* Get a cookie value 
* @param string cookie name 
*/  

function getCookie(name) {  
    var start = document.cookie.indexOf(name + "=");  
    var len = start + name.length + 1;  
    if ((!start) && (name != document.cookie.substring(0, name.length))) {  
        return null;  
		}  
    if (start == -1) return null;  
    var end = document.cookie.indexOf(";", len);  
    if (end == -1) end = document.cookie.length;  
    return unescape(document.cookie.substring(len, end));  
	}
	
/** 
* Remebers form inputs after you fill them in 
* @param string form id to remember fields 
* @param string a prefix to prepend to all cookie names. (prevent naming conflicts) 
*/  

function rememberFormInputs(form_id, prefix) {  
    var form = document.getElementById(form_id);
    var els = document.getElementsByTagName('input'); 
    for (var i = 0; i < els.length; i++) {  
        var el = els.item(i);  
        if (el.type == 'text') {
			el.onblur = function() {
				var name = this.name; 
				var value = this.value;
				setCookie(prefix + name, value, 90);  
				};
            var old_value = getCookie(prefix + el.name);  
            if (old_value && old_value != '') {  
                el.value = old_value;  
				}  
			}  
		}
	}

Does anyone have a solution? I would really appreciate it :]

I have rough ideas on how to achieve this but I dont know how to start.

I want to use a drop-down menu selection option to submit a form.

But the form's contents change depending on the option.

This is the basic form:

Code:

<FORM ID="go1" METHOD="POST" TARGET="_self">
<INPUT TYPE=HIDDEN NAME=UserID VALUE="<%UserID%>">
<INPUT TYPE=HIDDEN NAME=Password VALUE="<%Password%>">
<INPUT TYPE=HIDDEN NAME=SubUnitID VALUE="4266">
<INPUT TYPE=HIDDEN NAME=PageID VALUE="1">
<INPUT TYPE="IMAGE" class="hand" border="0" src="/images/my.gif" width="45" height="26" vspace="5">
</FORM>

At the moment, it's an image which gets clicked on but it needs to be the option chosen. I think I can do that with:

Code:

function gotoPage(s){
   var v = s.selectedIndex;
   var select = document.forms.form.elements.input; // selects question
   if (v == 1){...}
   if (v == 2){...} etc.

However, as I said, the form's contents must change depending on the option chosen:

The form's values which change a

Code:

<INPUT TYPE=HIDDEN NAME=SubUnitID VALUE="4266">
<INPUT TYPE=HIDDEN NAME=PageID VALUE="1">

Can someone point me in the right direction?

Hi Everyone,

I'm encountering errors with a form I have created. I feel confident that the issue is with my JS validation form because when I allow the form to submit without validating any of the fields, my php processor correctly uploads all the content into my database (but, I will need the form validation to prevent the user from skipping fields).

The issue (I believe) is with IE. In IE, both drop-downs seem to populate correctly but when I submit the form, I get a prompt to make a selection for the first drop-down menu.

The form does submit properly in FireFox and Safari but with some testing I noticed that I was getting a prompt to make a selection in the first drop-down in instances where a selection was already made but I just had not yet populated the second country/state drop-down.

Still, in Firefox and Safari, the form does pass validation upon submit.. So, I am hoping it's just IE specific issue.

I'm thinking the issue is with IE not recognizing my selection. The form had a drop-down menu where the user selects a letter, then that selection triggers (in JS using a function to process the selection) another drop-down to populate with all the countries or states that begin with the letter from the first selection.

Here is the code from my form:

Code:

<p><span class="title">Sign Up</span></p>
            <br />
   		 <form id = "signupForm" action="signup_process.php" method = "post" onsubmit="return validateSignupForm();">
      	  <p>All required fields are marked with ( <span class = "requiredStar">*</span> )</p>
          <br />
           <p><label for="first_name">First Name: <span class = "requiredStar">*</span></label></p>
          <div class = "contactRight"><input type="text" name="first_name" id="first_name" style="height: 20px;" size="30" tabindex="1" maxlength="30" /></div>
          <br />
          <p><label for="last_name">Last Name: <span class = "requiredStar">*</span></label></p>
          <div class = "contactRight"><input type="text" name="last_name" id="last_name" style="height: 20px;" size="30" tabindex="2" maxlength="30" /></div>
          <br />
          <p><label for="countryLtr">Select the first letter of your country: <span class = "requiredStar">*</span></label></p>
          <select id="countryLtr" name="countryLtr" id="countryLtr" size="1" tabindex="3" onchange="processSelection()">
          		<option value=""></option>
                        <option value="USA">USA</option>
                        <option value="A">A</option>
          		<option value="B">B</option>
          		<option value="C">C</option>
          		<option value="D">D</option>
          		<option value="E">E</option>
          		<option value="F">F</option>
          		<option value="G">G</option>
          		<option value="H">H</option>
          		<option value="I">I</option>
          		<option value="J">J</option>
          		<option value="K">K</option>
        		<option value="L">L</option>
         		<option value="M">M</option>
         		<option value="N">N</option>
          		<option value="O">O</option>
          		<option value="P">P</option>
          		<option value="Q">Q</option>
          		<option value="R">R</option>
          		<option value="S">S</option>
          		<option value="T">T</option>
          		<option value="U">U</option>
          		<option value="V">V</option>
          		<option value="W">W</option>
          		<option value="Y">Y</option>
          		<option value="Z">Z</option>
                </select>
          <br />
          <br />
          <p><label for="countryState">Select your country/ state (if USA): <span class = "requiredStar">*</span></label></p>
          <select id="countryState" name="countryState" id="countryState" size="1" tabindex="4">
          </select>
          <br />
          <br />
          <p><label for="username">Create a username: <span class = "requiredStar">*</span></label></p>
          <div class = "contactRight"><input type="text" name="username" id="username" style="height: 20px;" size="30" tabindex="5" maxlength="30" /></div>
          <br />
          <p><label for="email">Email: <span class = "requiredStar">*</span></label></p>
          <div class = "contactRight"><input type="text" name="email" id="email" style="height: 20px;" size="30" tabindex="6" maxlength="30" /></div>
          <br />
          <p><label for="password">Create a password: <span class = "requiredStar">*</span></label></p>
          <div class = "contactRight"><input type="password" name="password" id="password" style="height: 20px;" size="30" tabindex="7" maxlength="30" /></div>
          <br />
 		  <br />
		  <input type="hidden" name="source" value="12345">
          <input type="image" name="submit" value="Submit" class="submitButton" src="images/submit-button.png" />
          <input type="image" name="reset" value="Reset" class="resetButton" src="images/reset-button.png" />
          <br />
   		 </form>

and here is the code for processing the selection of the first drop-down and populating the second drop-down (I reduced the number of options for the countries to save on characters for this post):


Code:

function processSelection() {
	
	choice1 = document.getElementById("countryLtr");
	choice2 = document.getElementById("countryState");
	
	choice2.length = 0;

	if (choice1.value == "USA") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Alaska");
		choice2[choice2.length] = new Option("American Samoa");
		choice2[choice2.length] = new Option("Arizona");
		choice2[choice2.length] = new Option("Arkansas");
		choice2[choice2.length] = new Option("California");
		choice2[choice2.length] = new Option("Colorado");
		choice2[choice2.length] = new Option("Connecticut");
		choice2[choice2.length] = new Option("Delaware");
		choice2[choice2.length] = new Option("District of Columbia");
		choice2[choice2.length] = new Option("Florida");
		choice2[choice2.length] = new Option("Georgia");
		choice2[choice2.length] = new Option("Guam");
		choice2[choice2.length] = new Option("Hawaii");
		choice2[choice2.length] = new Option("Idaho");
		choice2[choice2.length] = new Option("Illinois");
		choice2[choice2.length] = new Option("Indiana");
		choice2[choice2.length] = new Option("Iowa");
		choice2[choice2.length] = new Option("Kansas");
		choice2[choice2.length] = new Option("Kentucky");
		choice2[choice2.length] = new Option("Louisiana");
		choice2[choice2.length] = new Option("Maine");
		choice2[choice2.length] = new Option("Maryland");
		choice2[choice2.length] = new Option("Massachusetts");
		choice2[choice2.length] = new Option("Michigan");
		choice2[choice2.length] = new Option("Minnesota");
		choice2[choice2.length] = new Option("Mississippi");
		choice2[choice2.length] = new Option("Missouri");
		choice2[choice2.length] = new Option("Montana");
		choice2[choice2.length] = new Option("Nebraska");
		choice2[choice2.length] = new Option("Nevada");
		choice2[choice2.length] = new Option("New Hampshire");
		choice2[choice2.length] = new Option("New Jersey");
		choice2[choice2.length] = new Option("New Mexico");
		choice2[choice2.length] = new Option("New York");
		choice2[choice2.length] = new Option("North Carolina");
		choice2[choice2.length] = new Option("North Dakota");
		choice2[choice2.length] = new Option("Northern Marianas Islands");
		choice2[choice2.length] = new Option("Ohio");
		choice2[choice2.length] = new Option("Oklahoma");
		choice2[choice2.length] = new Option("Oregon");
		choice2[choice2.length] = new Option("Pennsylvania");
		choice2[choice2.length] = new Option("Puerto Rico");
		choice2[choice2.length] = new Option("Rhode Island");
		choice2[choice2.length] = new Option("South Carolina");
		choice2[choice2.length] = new Option("South Dakota");
		choice2[choice2.length] = new Option("Tennessee");
		choice2[choice2.length] = new Option("Texas");
		choice2[choice2.length] = new Option("Utah");
		choice2[choice2.length] = new Option("Vermont");
		choice2[choice2.length] = new Option("Virginia");
		choice2[choice2.length] = new Option("Virgin Islands");
		choice2[choice2.length] = new Option("Washington");
		choice2[choice2.length] = new Option("West Virginia");
		choice2[choice2.length] = new Option("Wisconsin");
		choice2[choice2.length] = new Option("Wyoming"); 
	
	} else if (choice1.value == "A") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Azerbaijan");
	
	} else if (choice1.value == "B") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("The Bahamas");
		
	} else if (choice1.value == "C") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Czech Republic");
	
	} else if (choice1.value == "D") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Denmark");
	
	} else if (choice1.value == "E") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Ecuador");
	
	}  else if (choice1.value == "G") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Gabon");
	
	}  else if (choice1.value == "H") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Haiti"); 
	
	}  else if (choice1.value == "I") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Iceland"); 
	
	}  else if (choice1.value == "J") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Jamaica"); 
	
	}  else if (choice1.value == "K") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Kazakhstan");
	
	}  else if (choice1.value == "L") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Laos");  
	
	}   else if (choice1.value == "M") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Macau"); 
	
	}   else if (choice1.value == "N") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Namibia"); 
	
	}  else if (choice1.value == "O") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Oman");    
	
	}  else if (choice1.value == "P") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Pakistan"); 
	
	}  else if (choice1.value == "Q") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Qatar");  
	
	}  else if (choice1.value == "R") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Reunion");  
	
	}  else if (choice1.value == "S") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Saint Helena"); 
	
	}  else if (choice1.value == "T") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Taiwan"); 
	
	}  else if (choice1.value == "U") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Uganda"); 
	
	}  else if (choice1.value == "V") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Vanuatu");  
	
	}  else if (choice1.value == "W") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Wake Island");  
	
	}  else if (choice1.value == "Y") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Yemen");   
	
	}  else if (choice1.value == "Z") {
		
		choice2[choice2.length] = new Option("");
		choice2[choice2.length] = new Option("Zambia"); 
	}


}

Here is the code for validating the form upon submission:

Code:

function validateRequestForm() {
	
	var theForm = document.getElementById("requestForm"); //form reference
	var valid = true; //flag, must be true to proceed
	
	if (theForm.name.value == "") {
			
			alert ("Please enter a name");
			valid = false;
			theForm.username.focus();
	
	
	} else if (theForm.countryLtr.value == "") {
	
			
			alert ("Please select the first letter of your country");
			valid = false;
			theForm.countryLtr.focus();
	
	
	} else if (theForm.countryState.value == "") {
	
			
			alert ("Please select your country. If USA, please select your state");
			valid = false;
			theForm.countryState.focus();
	
	
	} else if (theForm.email.value == "") {
	
			
			alert ("Please enter your email address");
			valid = false;
			theForm.email.focus();
	
	
	} else if (theForm.title.value == "") {
		
			
			alert ("Please enter a title for your request");
			valid = false;
			theForm.title.focus();
	
	
	} else if (theForm.request.value == "") {
	
			
			alert ("Please enter your request");
			valid = false;
			theForm.request.focus();
	
	
	} if (valid == true) {
			
				alert ("Thank you for your prayer request. Your request has been submitted for review. Please check your account to see the status of your prayer request. You may also check recent requests to view your request after it has been posted.");
				return true; //submit form
	
	} else {
				return false; //form invalid
	}
}

I'm totally stumped as to what could be going on in IE that is not allowing the form to pass JS validation.. Any help would be greatly appreciated!! Thanks!

I have created this form. I would like to use javascript to mail the form to the selected email from the selection list when the submit button is pressed.
could anyone help with this?

<form name="Contact Us" id="contact" action="mailto:" method="post">
<fieldset id="selection">
Who would you like to email:
<select>

<option value="email1" >email1</option>
<option value="email2" >email2</option>
<option value="email3">email3</option>
</select>
<fieldset id="Name" >
Name
<input type="text" id="firstname" name="firstname">
E-mail
<input type="text" id="email" name="email">
</fieldset>
<fieldset id="question">
Comments and Questions
<input type="text" id="comment" name="comment" style="width: 500; height: 300">
</fieldset>
</form>

I'm trying to write a progressively enhanced web application. I have an index page and a form with some select boxes and some radio buttons on a different php page. Before enhancement occurs, the form is accessible via regular links and everything works as expected. No issues.

In the enhanced version of the application, the form is AJAXed into the index page. When this occurs, the select boxes in the form work perfectly. The radio buttons are initially unchecked and I can check one option as usual. However, once one is checked, clicking the other radio options does nothing. I am unable to check a different option.

Anybody got a clue what the problem is?

Using Chrome by the way. Firefox is the same as Chrome. In IE I can't even check a radio button the first time.

Here's the code that's ajaxed in:

Code:

<label>First Time Buyer Status

  <!--These values can't be 1/0 because 0 stands for not set-->
  <input type="radio" name="FTB" id="FTBYes" value="1" <?php $M->checkFTBValue(1); ?> title=""/>First Time Buyer

  <input type="radio" name="FTB" id="FTBNo"  value="2" <?php $M->checkFTBValue(2); ?> title=""/>Not First Time Buyer
</label>

The PHP script you see there checks if the value on the server matches the value of the radio button and echo's checked="checked" if true. I thought this could be causing the problem initially but the exact same code is used in the non-enhanced version and it works fine. I tried commenting it out anyway but it makes no difference.

The only thing I can think of is that some javascript is preventing me from selecting a different radio option. That would explain why it works ok in the non-enhanced version because there is no JS there. I can't find anything that I've written that might cause this effect I'm using jQuerys form plugin on my pages. I'm going to try writing it out and see if that fixes anything. Any body ever experience a similar problem with this?

In the mean time, is there a way I can check if any JS functions when I click on the radio button?


Sorry if this is in the wrong forum, there's so many different languages involved, I hadn't a clue where to put it.

Ok I am very very new to java to the point where I only know how to use pre-made javascripts in my php code so be gentle.

First, here is part of a form I have:

Code:

<select name = "pulmonologist" >
<option selected="" value="">---Select---
<option value="none">None</option>
<?php		
while ($row2 = mysql_fetch_assoc ($results2)) {   
        ?><option value = "<?php echo $row2['staff_name'];?>"><?php echo $row2['staff_name'];?></option>
<?php }
?>
</select>

Ok now I want to echo the value that the user selects on the SAME page (i.e. before the submit button is pressed) (so I can't do it with php, I need javascript) like this:

Code:

<input type="submit" value = "Contact <?php echo $pulmonologist;?>" />

Can you tell me how to do this? Thanks!

The Script works in Firefox, BUT not in Internet Explorer. What am I missing? I need Drop Down menu Boxes to appear when User clicks on a certian Menu option. The way it appears now on the website is all the boxes appear. They should stay "hidden" until a User clicks on the drop down menu selection. Thanks!

<head>
<script type="text/javascript" language="javascript">

function showInfo()
{
var typeOne = document.getElementById('bmp');
var typeTwo = document.getElementById('junction');
var typeThree = document.getElementById('mile');
if(document.basicform01.Location_Type.value == "BMP to EMP")
{
typeOne.style.display="inline";
typeTwo.style.display="none";
typeThree.style.display="none";
}
else if(document.basicform01.Location_Type.value == "Junction to Junction")
{
typeOne.style.display="none";
typeTwo.style.display="inline";
typeThree.style.display="none";
}
else if(document.basicform01.Location_Type.value == "Milepost")
{
typeOne.style.display="none";
typeTwo.style.display="none";
typeThree.style.display="inline";
}
else
{
typeOne.style.display="none";
typeTwo.style.display="none";
typeThree.style.display="none";
}
}

</script>



<style>*[style] {outline:none}</style>


</head>

<body>
<fieldset>
<dl>
<dt><label for="Location_Type">Location Type *</label></dt>
<dd><select class="inputselect" name="Location_Type" id="Location_Type" onchange="showInfo()">
<option value="" selected="selected">Select One...</option>
<option value="BMP to EMP">BMP to EMP</option>
<option value="Junction to Junction">Junction to Junction</option>
<option value="Milepost">Milepost</option>
</select></dd>
<div id="bmp" style="display:none;">
<dt><label for="bmpDetails">BMP</label></dt>
<dd><input class="inputtext" type="text" name="bmpDetails" id="bmpDetails" /></dd>
<dt><label for="empDetails">EMP</label></dt>
<dd><input class="inputtext" type="text" name="empDetails" id="empDetails" /></dd>
</div>
<div id="junction" style="display:none;">
<dt><label for="fromJunction">From Junction:</label></dt>
<dd><input class="inputtext" type="text" name="fromJunction" id="fromJunction" /></dd>
<dt><label for="toJunction">To Junction:</label></dt>
<dd><input class="inputtext" type="text" name="toJunction" id="toJunction" /></dd>
</div>
<div id="mile" style="display:none;">
<dt><label for="milepostNum">Milepost</label></dt>
<dd><input class="inputtext" type="text" name="milepostNum" id="milepostNum" /></dd>
</div>
<p>
</dl>
<p>
</fieldset>

</body>

Please help with the code details as to how this would be possible. Thanks.

<form method="post" name="validate" action="internet_marketing_and_email_blasting_signup.php" enctype="multipart/form-data" onmouseover="change(event,'../images/submit1.png')" onmouseout="change(event,'../images/submit.png')" onkeyup="highlight(event)" onclick="highlight(event)">

Hi there,
I need help in form validation! I want this to be validated upon selection of the drop down list (not when it comes to submit button)

I have 2 drop down lists:
Starting date (June 5th, 6th 7th)
Ending date (June 5th, 6th 7th)

I want to write a script that would NOT ALLOW one to choose:
- Starting date June 6th and Ending date June 5th
- Starting date June 7th and Ending date June 6th
- Starting date June 7th and Ending date June 5th

I appreciate your help

Hello everyone, I just stumbled across this forum and thought maybe someone here could help me with a few coding alterations.

I would like to position the rss feed selection fields on this feed output so I can scroll the feed with the selection fields remaining stationary.

Code:

<link rel="icon" type="image/png" href="rss_include/feed-icon-red.png">
<style language='text/css'>
  @import url('rss_include/style.css');
</style>

<script language="javascript">
    var XMLHttpRequestObject = false;
	var img = new Image();
	img.src = "rss_include/loading.gif";
    
    if ( window.XMLHttpRequest )
        XMLHttpRequestObject = new XMLHttpRequest();
    else if (window.ActiveXObject)
        XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");

	function changeOptions()
	{
		LoadFeed();
	}
	
	function LoadFeed(value, initial)
	{		
        if ( XMLHttpRequestObject )
        {
            var dsource = "rss_include/ajax.php?loadfeed"; 

			if (value)
				dsource += "=" + value;
			else
			{
				var val = document.getElementById("rss_feed").value;
				if ( val == "" )
					document.getElementById("rss_feed").selectedIndex += 1;

				dsource += "=" + document.getElementById("rss_feed").value;
			}

			dsource += "&fulltext=" + document.getElementById("showtext").checked;
			dsource += "&showimages=" + document.getElementById("showimages").checked;
			
            XMLHttpRequestObject.open("GET",dsource);
            XMLHttpRequestObject.onreadystatechange = function()
            {
				if ( XMLHttpRequestObject.readyState != 4 )
				{
					document.getElementById("rss_div").innerHTML = "<center><img class=\"loading\" src=\"" + img.src + "\"></center>";	
				}
				
                if ( XMLHttpRequestObject.readyState == 4 && 
                        XMLHttpRequestObject.status == 200 )
                {
					document.getElementById("rss_div").innerHTML = XMLHttpRequestObject.responseText;
                }
            }
            XMLHttpRequestObject.send(null);
        }		
	}
</script>

<?php

require_once("rss_include/config.php");

function LoadFile($xml_file)
{
	$xml = null;
	if ( !file_exists($xml_file) || !($xml = simplexml_load_file($xml_file)) )
	{
		echo '</select>';
		echo "Error opening XML feeds file: $xml_file<br>";
		return;
	}
	
	return $xml;
}

function ShowFeedOptions($xml_file)
{	
	echo '<select id="rss_feed" onChange="LoadFeed(this.value)" title="GuyWMustang.com RSS Reader">';
	
	$xml = LoadFile($xml_file);
	if ( $xml == null )
		return;
	
	$url = array();
	foreach($xml->feeds->category as $category)
	{
		echo "<option value=\"\">" . $category['name'] . "</option>";
		
		foreach($category->feed as $feed)
		{
			if ( $feed['name'] != "" )
			{
				// Add a spacing to the feeds
				$name = "&nbsp;&nbsp;&nbsp;&nbsp;" . $feed['name'];
				$url = str_replace("&", "%26", $feed['url']);
				$url = str_replace("http://", "", htmlspecialchars($url));
				echo "<option value=\"$url\">" . $name . "</option>";
			}
		}
	}
	
	echo '</select>';
	
	$options = array();
	$rss = $xml->options[0];

	if ( strcasecmp($rss['fulltext'],"true") == 0 )
		array_push($options, "true");
	else
		array_push($options, "false");
		
	if ( strcasecmp($rss['images'],"true") == 0 )
		array_push($options, "true");
	else
		array_push($options, "false");

	return $options;
}

function SetOptions($options)
{
	if ( sizeOf($options) == 2 )
	{
		echo "<script>document.getElementById(\"showtext\").checked = " . $options[0] . ";</script>";
		echo "<script>document.getElementById(\"showimages\").checked = " . $options[1] . ";</script>";
	}
}

if ( isset($_GET['links']) )
{
	$xml = LoadFile($xml_file);
	if ( $xml == null )
		return;

	// end the link editing
	return;
}

?>
<div class="container" id="container_div">
	<a name="top"></a>
		<div class="header_div">
			<div style="display:run-in;float:left;">
			<font class="graytext">RSS Feed:</font>
			<?php $options = ShowFeedOptions($feeds_xml); ?>
			
			<input type="checkbox" id="showtext" onChange="changeOptions(this)" checked><font class="graytext">Show Full Article Text</font>
			<input type="checkbox" id="showimages" onChange="changeOptions(this)" checked><font class="graytext">Show Images</font>
			</div>
			
			<?php SetOptions($options); ?>
		</div>
	<div class="rss" id="rss_div">
		<script>LoadFeed(document.getElementById('rss_feed').value, true);</script>
	</div>
	<!-- <p style="padding:0px;margin-right:2px;margin:0px;" align="center"><a class="top" href="#top">Top</a></p> -->
</div>

<-- CSS BELOW -->


Code:

body
{
	overflow: auto;
	font-family: arial;
}
div.header_div
{
	position: relative;
	/*background-color: #EFEFEF;*/
	width: 100%;
	overflow: auto;
	margin: auto;
}
div.container
{
	/*border: 1px solid black;
	background-color: #EFEFEF;*/
	position: relative;
	margin: auto;
	display: block;
	overflow: auto;
	/* SPECIFY HEIGHT & WIDTH AS DESIRED */
	height: 90%;
	width: 80%;
}
div.rss
{
	width: 99%;
	margin: 2px;
	background-color: tan;
	position: relative;
	/*border: 1px solid black;*/
}
img.loading
{
	position: relative;
	margin-top: 50px;
}
a.rss_link,a.rss_link:active
{
	display: inline;
	color: blue;
}
a.rss_link:hover
{
	color: #BBBBFF;
}
a.rss_link:visited
{
	color: black;
}
a.top,a.top:active {
	text-decoration: none;
	font-size: 10pt;
	display: inline;
	color: black;
}
a.top:hover {
	text-decoration: underline;
	color: brown;
	display: inline;
}
font.graytext
{
	font-size: 10pt;
	color: #444444;
}
font.rss_title
{
	font-size: 12pt;
	font-weight: bold;
	text-decoration: underline;
}
font.rss_date
{
	font-size: 9pt;
	font-weight: normal;
	color: black;
	display: block;
}
font.rss_description
{
	font-size: 12pt;
	color: blue;
}
select
{
	color: black;
	font-size: 10pt;
	background-color: #EAEAEA;
}

any help would be greatly appreciated.....thanks

What I want to do, is that, when the user select one option out of many from the dropdown box some new fields appears.

I was so close to make it , using this example:
Code:

<script type="text/javascript">
function showInfo()
{
var elem = document.getElementById('verify');
if(document.forms[0].menu.value == "verify"){
elem.style.display="inline";}
else{
elem.style.display="none";}
}
</script>
</head>

<body>
<form action="#" method="post">
<select name="menu" onchange="showInfo()">
<option value="none">Select an option</option>
<option value="email">Email</option>
<option value="verify">Verify</option>
</select>

<div id="verify" style="display:none;">
<input type="text" value="Username" >
<input type="password" value="password" >
</div>
</form>

But what I do want, is that two differen things appear on the page and in the different location of the page. And this script does not read the second <div>. So the result is, that the only first <div> appears.

Here are some images of what I want to do.
Befo
http://img82.imageshack.us/img82/7093/beforens9.jpg

After
http://img246.imageshack.us/img246/2759/afterzh2.jpg (what has to be changed is on the red circules).

So can someone help me with this script?? Please! I am pritty noob to the javascript.

I want to have several forms on one page that are not displayed until a selection is made from the category drop down box(select element). The form displayed will depend on the selection made. Here is the code I have so far. Please help.

Code:

<body>
<label id="Label1">ADMINISTRATOR CONSOLE - ADD AND EDIT ASSETS<br />
</label>
<form action="" method="post" style="border-style: ridge; width: 311px; height: 37px;" name="myform">
<table>
<tr>
<td>Select Category:</td><td>
<select name="category" onchange="set_sub_category()" style="width: 157px">
<option selected="selected" value="select">Select an Option</option>
<option value="add">Add Category</option>
<option value="district">Council District</option>
<option value="region">Region</option>
<option value="pom">POM</option>
<option value="proptype">Property Type</option>
<option value="assetcat">Asset Category</option>
<option value="assettype">Asset Type</option>
<option value="property">Property</option>
<option value="asset">Asset</option>
</select>
</td>
</tr>
</table>
</form>

<form style="display:none" action= "admin_console_new.html" onsubmit="return (validate_form(this)& validate_list(this))" method="post" style="border-style: ridge; border-width: medium; height: 154px; width: 346px;" name="district">
<table style="height: 86px">
<tr>
<td>Select District Value:</td><td>
<select name="district">
<option selected="selected">Select an Option</option>
<option>Add Council District</option>
</select>
</td>
</tr><tr>
<td>Enter District Name:</td><td>
<input name="name" type="text"/>
</td>
</tr><tr>
<td>Enter Description:</td><td><textarea name="description"></textarea>
</td>
</tr><tr>
<td><input type="submit" value="Submit" name="Submit3" /><input type="reset" value="Reset" />
</td>
</tr>
</table>
</form>

Hey guys!

First of all I dont want anyone to do it all for me, tho if u want to sure!
"Else please help me out with just saying where I should start."
I have done some simple dice games etc with JS and thats about it.

Anyways, Im trying to do a DHTML menu/form with JS, if u click on one option only the menu it self should change so u dont get into another HTML file coz I wanna put it all on the same file ( exept for the "SEND" link ).

(Check the pictures I uploaded)

If u press "contact" the menu it self should get larger with the contact adress bellow, And if u press SEND u should get into another contact form where u have to fill out ur information.
And when u filled out ur name the contact form should get even bigger with more questions to fill out. - Once again check the pictures I uploaded if u dont know what im talking about

pic1: http://i403.photobucket.com/albums/pp115/kyth1/send.jpg
pic2: http://i403.photobucket.com/albums/p...yth1/send2.jpg



Thx - / Jul

Hello,

I have been working with different codes to get a search form working with a database.

I wonder if someone with better expertise can assist.

I have a search form based on drop down option values, what I would like to do is select a "company" and append the search term to the company's value.

E.G the form would be something like:

<option value="http://url?term=valueisfromsearch&folder=Company Name">Company</option>

There will be a free text area which will allow users to input their search term but need this go feed into the above value of "valueisfromsearch".

Upon submit, the user will be presented with their results in their browser.

Is this possible mid-URL? I've seen info on Javascript Query String Parameters but don't really understand it that well.

Thanks,

Uzzi