0

hey U guys..
I need a jsp code which uses AJAX with dropdowns..
Something like COUNTRY NAME in one dropdown and STATE NAME in the other...
You may select any STATE at first.. Later when we CHANGE the COUNTRY NAME, states of that particular COUNTRY WILL GET REFRESHED IN THE STATE DROPDOWN...
So any text before or after the AJAX section will not be refreshed...
and no php or .net please


Thank you

2
Contributors
2
Replies
4
Views
6 Years
Discussion Span
Last Post by nikhilrkn
0

Sorry for the rude approach..
i did try few things..
can u point why i am not able to get the oupput for this below.. i ve put up all the referred files..

[U][B]file-index.html[/B][/U]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dependant Drop Downs Using Ajax</title>
<meta name="robots" content="noindex, nofollow" />
<script src="js/functions.js" type="text/javascript"></script> 
</head>

<body>

<form>
	<select id="CarMake" name="CarMake" onchange="GetModels();">
		<option value=""> -- Please Select -- </option>
		<option value="Audi">Audi</option>
		<option value="BMW">BMW</option>
		<option value="Ford">Ford</option>
	</select>
        <br>
        <br>
        <br>
        <br>
        <br>
	<select id="CarModel" name="CarModel">
		<option value="">  Please Select  </option>
	</select>
</form>

</body>
</html>

[U][B]file-model.asp[/B][/U]
<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<%

strCarMake = request("Make")
strCarModels = ""

select case lcase(strCarMake)

	case "audi"
		strCarModels = "A1||A2||A3||A4||A5"
	case "bmw"
		strCarModels = "Series 1||Series 3||Series 5||Series 6||Series 7"
	case "ford"
		strCarModels = "Ka||Fiesta||Focus||Focus RS||Mondeo"

end select

response.Write(strCarModels)
%>


[U][B]file-function.js[/B][/U]
//Our XmlHttpRequest object to get the models
var xmlModels = getXmlHttpRequestObject();

//Gets the browser specific XmlHttpRequest Object
function getXmlHttpRequestObject() {
	if (window.XMLHttpRequest) {
		return new XMLHttpRequest();
	}else if(window.ActiveXObject) {
		return new ActiveXObject("Microsoft.XMLHTTP");
	}
}

function GetModels(){

	//Get the Car Make
	sltCarMake = document.getElementById("CarMake");
	strCarMake = sltCarMake.options[sltCarMake.selectedIndex].value;
	
	//URL to get the models from, the timestamp is to ensure that
	//each request is fresh, and not cached (especially if data is from the database)
	var timestamp = Number(new Date());
	var url='models.asp?Make=' + strCarMake + '&ts=' + timestamp
	
	//The Ajax Request, the response is handled in the function Models_Handle
	xmlModels.open("GET", url, true);
	xmlModels.onreadystatechange = Models_Handle; 
	xmlModels.send(null);
}

function Models_Handle(){
	if (xmlModels.readyState == 4) {
		
		//Get the Response
		var strResponse = xmlModels.responseText
		
		//Car Model object
		sltCarModel = document.getElementById("CarModel");
				
		//reset select menu to default
		sltCarModel.options.length=0;
		sltCarModel.options[0] = new Option(" -- Please Select -- ","");
		
		if (strResponse != ""){
			
			//Split response into array
			var arrResponse = strResponse.split("||");	
			
			var arrLen = arrResponse.length;
			var intPos = 0;
			for(i=0;i<arrLen;i++){
				sltCarModel.options[i + 1] = new Option(arrResponse[i],arrResponse[i]);
			}
		}		
	}
}
This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.