Javascript parses JSON data using json2.js

Entity-type city

Public class city {
Private integer cityid;
Private string cityname;
Private integer provinceid;

Public City (){
Super ();
}

Public City (string cityname, integer provinceid ){
Super ();
This. cityname = cityname;
This. provinceid = provinceid;
}

Public City (integer cityid, string cityname, integer provinceid ){
Super ();
This. cityid = cityid;
This. cityname = cityname;
This. provinceid = provinceid;
}
Public integer getcityid (){
Return cityid;
}
Public void setcityid (integer cityid ){
This. cityid = cityid;
}
Public String getcityname (){
Return cityname;
}
Public void setcityname (string cityname ){
This. cityname = cityname;
}
Public integer getprovinceid (){
Return provinceid;
}
Public void setprovinceid (integer provinceid ){
This. provinceid = provinceid;
}
}

Server: districtservices

Public void dopost (httpservletrequest request, httpservletresponse response)

Throws servletexception, ioexception {

Response. setcontenttype ("text/html ");
Response. setcharacterencoding ("GBK ");
Printwriter out = response. getwriter ();
Citydao = new citydao ();
String op = request. getparameter ("op ");
If ("changecities". Equals (OP )){
String provinceid = request. getparameter ("provinceid ");
If (provinceid! = NULL &&! "". Equals (provinceid )){
Integer id = integer. parseint (provinceid );
List <city> cities = citydao. getcitiesbyprovinceid (ID );
Jsonobject JSON = new jsonobject ();
JSON. Put ("Cities", cities );
Out. println (JSON. tostring ());
} Else {
Out. Print (false );
}
}

Out. Flush ();
Out. Close ();

}

Page:

<SCRIPT src = "json2.js" Language = "JavaScript" type = "text/JavaScript"> </SCRIPT>

<Script language = "JavaScript">
VaR XMLHTTP; // declare the browser initialization object variable
Function changecities (){
VaR F = Document. myform;
VaR provinceid = f. provinceid. value;
Doajax ("districtservices? OP = changecities & provinceid = "+ provinceid );
}
Function doajax (URL ){
If (window. XMLHttpRequest) // Firefox
{
XMLHTTP = new XMLHttpRequest ();
} Else if (typeof activexobject! = "Undefined") // IE
{
XMLHTTP = new activexobject ("Microsoft. XMLHTTP ");
}
// Determine whether the XMLHTTPRequest object is successfully created
If (! XMLHTTP ){
Alert ("XMLHTTPRequest object instance cannot be created ");
Return false;
}

// Create a request result Handler
XMLHTTP. onreadystatechange = processreuqest;

XMLHTTP. Open ("Post", URL, true );
// If a POST request is sent, you must add
XMLHTTP. setRequestHeader ("Content-Type", "application/X-WWW-form-urlencoded ");

XMLHTTP. Send (null );
}

Function processreuqest (){
If (XMLHTTP. readystate = 4) {// if it is 4, the request is completed.
If (XMLHTTP. Status = 200 ){

// Responsetext indicates the string information returned after the request is complete.
If (XMLHTTP. responsetext = "false "){
Alert ("no city information ");
} Else {

VaR object = JSON. parse (XMLHTTP. responsetext );
VaR cities = object. cities;
VaR cityselect = Document. getelementbyid ("cityid ");
Cityselect. Length = 0;
For (VAR I = 0; I <cities. length; I ++)
{
VaR option = Document. createelement ("option ");
Option. Text = cities [I]. cityname;
Option. value = cities [I]. cityid;
Cityselect. Options. Add (option );
}
}
} Else {
Alert ("An error occurred while processing the returned data ");
}
}
}
</SCRIPT>

<%
Provincedao = new provincedao ();
List <province> provinces = provincedao. getprovinces ();

%>
<Form ID = "myform" name = "myform" method = "Post" Action = "districtservices? OP = save ">
<Table width = "400" border = "0" cellspacing = "0" cellpadding = "0">
<Tr Height = "50">
<TD> select a province: </TD>
<TD>
<Select name = "provinceid" id = "provinceid" onchange = "changecities ()">
<% For (INT I = 0; I <provinces. Size (); I ++ ){
Province province = provinces. Get (I );
%>
<Option value = <% = province. getprovinceid () %> <% = province. getprovincename () %> </option>
<% }%>
</SELECT>
</TD>
</Tr>
<Tr Height = "50">
<TD> select a city: </TD>
<TD>
<Select name = "cityid" id = "cityid">
<Option value = "select city"> select city </option>
</SELECT>
</TD>
</Tr>
<Tr Height = "50">
<TD> enter the city: </TD>
<TD>
<Input name = "districtid" type = "text"/>
</TD>
</Tr>
<Tr>
<TD colspan = "2" align = "center"> <input type = "Submit" value = "Submit"/>
<Input type = "reset" value = "reset"/> </TD>
</Tr>
</Table>
</Form>