Ajax Reading database content to achieve two-level linkage drop-down selection menu example

Time:2021-9-3
Copy codeThe code is as follows:
< pre class = javascript name = “code” > < / pre > < pre class = javascript name = “code” > ———————————————————————- — < / pre > < pre class = javascript name = “code” > < / pre > < pre class = javascript name = “code” > function send_ request(callback, urladdress, isReturnData){
var xmlhttp = getXMLHttpRequest();
xmlhttp.onreadystatechange = function(){
If (xmlhttp. ReadyState = = 4) {/ / readyState is 4, that is, the data transmission ends
try{
if(xmlhttp.status == 200){
if(isReturnData && isReturnData==true){
callback(xmlhttp.responseText);
}
}else{
Callback (“sorry, we can’t find this page:” + urladdress + “);
}
} catch(e){
Callback (“sorry, sending request failed, please try again” + e);
}
}
}
xmlhttp.open(“POST”, urladdress, true);
xmlhttp.send(null);
}
function getXMLHttpRequest() {
var xmlhttp;
if (window.XMLHttpRequest) {
try {
xmlhttp = new XMLHttpRequest();
xmlhttp.overrideMimeType(“text/html; charset=UTF-8”);// Set UTF-8 code to identify data
} catch (e) {}
} else if (window.ActiveXObject) {
try {
xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);
} catch (e) {
try {
xmlhttp = new ActiveXObject(“Msxml2.XMLHttp”);
} catch (e) {
try {
xmlhttp = new ActiveXObject(“Msxml3.XMLHttp”);
} catch (e) {}
}
}
}
return xmlhttp;
}
< / pre > ———————————————————————————————————— < br >
<%@ page language=”java” contentType=”text/html; charset=UTF-8″ pageEncoding=”UTF-8″%><%@ taglib uri=”/struts-tags” prefix=”s”%><!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 type=”text/javascript” src=”<%=request.getContextPath()%>/js/xmlhttp.js”></script><script type=”text/javascript”>function getProcess(value) {var process = document.getElementById(‘process’);send_request(function(value2)
{process.innerHTML = value2;}, ” getProcessType.action?value=”+value, true);}</ Script > < / head > < body > < div > < form action = “” method = “post” name = “form” > < select name = “process” onchange = “getprocess (this. Value)” > < option value = “0” selected > please select the process type < / option > < option value = “Y” > business process < / option > < option
Value = “g” > management process < / option > < option value = “Z” > support process < / option > < / Select > < div > < select name = “smallclass” > < option value = “primary process name” selected > please select the primary process name < / option > < / Select > < / div > < input type = “submit” value = “submit” > < / form > < / div ></body></html>
<PRE></PRE>
<BR>
<P> < pre class = HTML name = “code” > < pre class = HTML name = “code” > ———————————————————————— — < / pre > < br >
<P></P>
<PRE></PRE>
Here is my business logic. Each logic is different, so this code is just to put the content you want to display in the request range, and then return to the next page. There are my myprocess class and its properties in the JavaBean
<P></P>
<P><PRE class=java name=”code”>public String getProcessType(){
HttpServletRequest request=ServletActionContext.getRequest();
String value=request.getParameter(“value”);
List<MyProcess> MyProcesses= processService.getProcessByType(value);
for(MyProcess p:MyProcesses){
System.out.println(p.getName());
}
request.setAttribute(“list”,MyProcesses);
return SUCCESS;
}< / pre > < pre class = HTML name = “code” > < / pre > < pre class = HTML name = “code” > < / pre > < pre class = HTML name = “code” > — — — — — — — — — — — — — — — — — — — — — — — — — < / pre > < pre class = HTML name = “code” > <% @ page language = “Java” C ontentType=”text/html; charset=UTF-8″
pageEncoding=”UTF-8″%>
<%@ include file=”/page/share/taglib.jsp”%>
<!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>
</head>
<body>
<select name=”smallclass”>
< option value = “first level process name” selected > please select the first level process name < / option >
<c:forEach items=”${list}” var=”myprocess”>
<option value=”${myprocess.processID}” >
${myprocess.name}
</option>
</c:forEach>
</select>
</body>
</html></PRE><BR>
<BR>
<P></P>
<P> This process is almost that</ P>
<P><BR>
</P>
</PRE>