AJAX self-learning exercises without refreshing data display from the database background

Source: Internet
Author: User

Request. jsp Copy codeThe Code is as follows: <% @ page language = "java" contentType = "text/html; charset = ISO-8859-1"
PageEncoding = "ISO-8859-1" %>
<! DOCTYPE html PUBLIC "-// W3C // dtd html 4.01 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8">
<Title> Insert title here </title>
<Script language = "javascript"> <! --
Function GetXmlHttpObject (){
Var xmlHttp = null;
Try {
XmlHttp = new XMLHttpRequest ();
} Catch (e ){
Try {
XmlHttp = new ActiveXObject ("Msxml2.XMLHTTP ");
} Catch (e ){
XmlHttp = new ActiveXObject ("Microsoft. XMLHTTP ");
}
}
Return xmlHttp;

}
Function showMsg (str ){
XmlHttp = GetXmlHttpObject ();
If (xmlHttp = null ){
Alert ("you browser don't support the ajax ");
Return;

}
Var url = "response. jsp ";
Url = url + "? Q = "+ str;
Url = url + "& sid =" + Math. random ();
XmlHttp. onreadystatechange = stateChanged;
XmlHttp. open ("GET", url, true );
XmlHttp. send (null );
}
Function stateChanged ()
{
If (xmlHttp. readyState = 4)
{
Document. getElementById ("showHint"). innerHTML = xmlHttp. responseText;
}
}
// --> </Script>
</Head>
<Body>
<Form name = "form1" action = "" method = "post">
<P> RocarsId: </p>
<Select name = "select1" onchange = "showMsg (document. form1.select1. options [document. form1.select1. selectedIndex]. value)">
<Option value = "140"> 140 </option>
<Option value = "150"> 150 </option>
</Select>
<Div id = "showHint"> Show rocars ccrn messages. </div>
</Form>
</Body>
</Html>

Response. jspCopy codeThe Code is as follows: <% @ page language = "java" contentType = "text/plain; charset = UTF-8"
PageEncoding = "UTF-8" %>
<% @ Page import = "com. lwf. eus. util. *, java. util. *, com. lwf. eus. entity. *, com. lwf. eus. bean. * "%>
<Html>
<Head>
<Title> response the ccrn </title>
</Head>
<Body>
<%
String q = request. getParameter ("q ");
System. out. println ("message:" + q );
RocarsBean rocars = RocarsEntity. getRocarsListById (q );
%>
<Table>
<Tr>
<Td> RocarsId </td>
<Td> RocarsCcrn </td> </tr>
<Tr>
<Td> <% = rocars. getRocarsId () %> </td>
<Td> <% = rocars. getCcrn () %> </td>
</Tr>
</Table>
</Body>
</Html>

Note that, unlike the self-study exercise, the request. the jsp page uses a div to display information, response. the content queried by jsp from the database is placed in the table tag, and other html tags are not displayed in the div.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.