DaniWeb Home > Forums > Web Development > PHP

RSS

Ajax Problem

Please support our PHP advertiser: Free Online Load Test - How many visitors can your web site handle?

•

Posts: 64

Reputation: nil_gh_80 is an unknown quantity at this point

Solved Threads: 0

nil_gh_80

Offline

Junior Poster in Training

Ajax Problem

Dec 22nd, 2008

Dear members,

I'm facing a problem using ajax..I ve two files language.php and ajax-language.php. In language.php I have a list of languages with checkbox where if i click a checkbox then a male female option will be shown. now the problem is when i'm going to click gender option then it shows nothing(in firefox error console it says "document.form1.sex is undefined")....can anybody plzzzzz take care to solve this isssue.

language.php..

 Help with Code Tags 
 php Syntax (Toggle Plain Text) 
<?php
echo $_REQUEST['langId'];
?>
 
 
<html>
	<head>
	<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
	var ajaxRequest;  // The variable that makes Ajax possible!
 
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
 
			// To display gender options 
			if(document.form1.scripts.length > 0){
				var ajaxGenderDisplay = document.getElementById('gender');
				ajaxGenderDisplay.innerHTML = ajaxRequest.responseText;
			}
			// TO display voice options
			if(document.form1.scripts.length > 0 && document.form1.sex.length > 0){
				var ajaxVoiceDisplay = document.getElementById('voice');
				ajaxVoiceDisplay.innerHTML = ajaxRequest.responseText;
			}
 
 
		}
	}
 
	var total=""
 
			for(var i=0; i < document.form1.scripts.length; i++){
				if(document.form1.scripts[i].checked){
					//total +=document.form1.scripts[i].value + ",";
					if(document.form1.sex.length == 0){
					total +=document.form1.scripts[i].value + ",";
					}else{
						for(var i=0; i < document.form1.sex.length; i++){	
							if(document.form1.sex[i].checked){
							total +=document.form1.scripts[i].value + "sex" + document.form1.sex[i].value + ",";
							}
						}
					}	
				}
			}
 
			//alert(total);
	var queryString = "?language=" + total ;
	ajaxRequest.open("GET", "ajax-language.php" + queryString, true);
	ajaxRequest.send(null); 
}
 
//-->
</script>
 
 
</head>
 
<body>
	<table border='0' width='50%' cellspacing='0' cellpadding='0' >
		<tr>
			<th>Language</th>
			<th>Gender</th>
			<th>Voice</th>
			<th>Quotation</th>
	<form name="form1" method="post">
		<tr>
			<td align=left valign="top">				
				<input type="checkbox" name="scripts" value='JavaScript' onChange="ajaxFunction();">JavaScript<br>
				<input type="checkbox" name="scripts" value='PHP' onChange="ajaxFunction();">PHP <br>
				<input type="checkbox" name="scripts" value='HTML' onChange="ajaxFunction();">HTML <br>
			</td>
			<td valign="top">
			<div id="gender"></div>
			</td>
			<td valign="top">
			<div id="voice"></div>
			</td>
			<td valign="top">
			<div id="quotation"></div>
			</td>
		</tr>	
 
	</form> 
</table>
</body>
</html>
<?php
echo $_REQUEST['langId'];
?>


<html>
	<head>
	<script language="javascript" type="text/javascript">
<!-- 
//Browser Support Code
function ajaxFunction(){
	var ajaxRequest;  // The variable that makes Ajax possible!
	
	try{
		// Opera 8.0+, Firefox, Safari
		ajaxRequest = new XMLHttpRequest();
	} catch (e){
		// Internet Explorer Browsers
		try{
			ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
		} catch (e) {
			try{
				ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
			} catch (e){
				// Something went wrong
				alert("Your browser broke!");
				return false;
			}
		}
	}
	// Create a function that will receive data sent from the server
	ajaxRequest.onreadystatechange = function(){
		if(ajaxRequest.readyState == 4){
			
			// To display gender options 
			if(document.form1.scripts.length > 0){
				var ajaxGenderDisplay = document.getElementById('gender');
				ajaxGenderDisplay.innerHTML = ajaxRequest.responseText;
			}
			// TO display voice options
			if(document.form1.scripts.length > 0 && document.form1.sex.length > 0){
				var ajaxVoiceDisplay = document.getElementById('voice');
				ajaxVoiceDisplay.innerHTML = ajaxRequest.responseText;
			}
			
			
		}
	}
	
	var total=""
		
			for(var i=0; i < document.form1.scripts.length; i++){
				if(document.form1.scripts[i].checked){
					//total +=document.form1.scripts[i].value + ",";
					if(document.form1.sex.length == 0){
					total +=document.form1.scripts[i].value + ",";
					}else{
						for(var i=0; i < document.form1.sex.length; i++){	
							if(document.form1.sex[i].checked){
							total +=document.form1.scripts[i].value + "sex" + document.form1.sex[i].value + ",";
							}
						}
					}	
				}
			}
						
			//alert(total);
	var queryString = "?language=" + total ;
	ajaxRequest.open("GET", "ajax-language.php" + queryString, true);
	ajaxRequest.send(null); 
}

//-->
</script>
		

</head>

<body>
	<table border='0' width='50%' cellspacing='0' cellpadding='0' >
		<tr>
			<th>Language</th>
			<th>Gender</th>
			<th>Voice</th>
			<th>Quotation</th>
	<form name="form1" method="post">
		<tr>
			<td align=left valign="top">				
				<input type="checkbox" name="scripts" value='JavaScript' onChange="ajaxFunction();">JavaScript<br>
				<input type="checkbox" name="scripts" value='PHP' onChange="ajaxFunction();">PHP <br>
				<input type="checkbox" name="scripts" value='HTML' onChange="ajaxFunction();">HTML <br>
			</td>
			<td valign="top">
			<div id="gender"></div>
			</td>
			<td valign="top">
			<div id="voice"></div>
			</td>
			<td valign="top">
			<div id="quotation"></div>
			</td>
		</tr>	
		
	</form> 
</table>
</body>
</html>

ajax-example.php....

 Help with Code Tags 
 php Syntax (Toggle Plain Text) 
<?php
$language = $_REQUEST['language'];
//echo $language;
 
$language = explode(',', $language);
foreach($language as $val){
	if($val !=''){
	$disp_opt = "<b>".$val."</b><br>";
	$disp_opt .= "<input type=\"checkbox\" name=\"sex\" value=\"m\" onChange=\"ajaxFunction();\">Male &nbsp;";
	$disp_opt .= "<input type=\"checkbox\" name=\"sex\" value=\"f\" onChange=\"ajaxFunction();\">Female &nbsp;<br>";
	echo $disp_opt;
	}
}
 
 
?>
<?php
$language = $_REQUEST['language'];
//echo $language;

$language = explode(',', $language);
foreach($language as $val){
	if($val !=''){
	$disp_opt = "<b>".$val."</b><br>";
	$disp_opt .= "<input type=\"checkbox\" name=\"sex\" value=\"m\" onChange=\"ajaxFunction();\">Male &nbsp;";
	$disp_opt .= "<input type=\"checkbox\" name=\"sex\" value=\"f\" onChange=\"ajaxFunction();\">Female &nbsp;<br>";
	echo $disp_opt;
	}
}


?>

Last edited by peter_budo : Dec 23rd, 2008 at 5:58 pm. Reason: Correcting code tags

Thread Tools Display Modes

Quick Reply to Thread

•

Only community members can participate in forum threads. You must register or log in to contribute.

Similar Threads

AJAX problem (JavaScript / DHTML / AJAX)
Frustrating Firefox Problem while making AJAX request on an anchor (JavaScript / DHTML / AJAX)
Radio Button - AJAX - Problem with Passing Value (JavaScript / DHTML / AJAX)
Problem with page link. (JavaScript / DHTML / AJAX)
multiple radiobutton values ajax problem (JavaScript / DHTML / AJAX)
AJAX Question (JavaScript / DHTML / AJAX)

Other Threads in the PHP Forum

Previous Thread: A little problem with a script
Next Thread: subcategory problem

•

Views: 405 | Replies: 0 | Currently Viewing: 1 (0 members and 1 guests)

•

Thread Tools	Display Modes
Show Printable Version Email this Page	Linear Mode Switch to Hybrid Mode Switch to Threaded Mode