Home > Article > Web Front-end > How to achieve dynamic acquisition of Jquery drop-down box data
How to achieve dynamic acquisition of Jquery drop-down box data
- php中世界最好的语言Original
- 2018-03-15 09:51:231975browse
This time I will show you how to implement the dynamic acquisition of Jquery drop-down box data. What are the precautions for the dynamic acquisition of Jquery drop-down box data. The following is a practical case, let's take a look.
Without further ado, let’s go directly to the source code:
select.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>" rel="external nofollow" >
<title>My JSP 'select.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css" rel="external nofollow" >
-->
<script type="text/javascript" src="js/jquery-2.1.1.min.js" charset="utf-8"></script>
<script type="text/javascript">
function get_app_type() {
$.ajax({
type: "post",
url: "AppTypeShow.action", //获取json数据
dataType: "json",
success: function(data) {
var d = eval("(" + data + ")");
for(var i = 0; i < d.length; i++) {
var id = d[i].id;
var name = d[i].name;
var opt = "<option value='" + id + "'>" + name + "</option>";
$("#appType").append(opt);
}
},
error: function() {
alert("系统异常，请稍后再试！")
}
});
}
function get_app_class() {
$.ajax({
type: "post",
url: "AppClassShow.action",
dataType: "json",
success: function(data) {
var d = eval("(" + data + ")");
for(var i = 0; i < d.length; i++) {
var id = d[i].id;
var name = d[i].name;
var opt = "<option value='" + id + "'>" + name + "</option>";
$("#appClass").append(opt);
}
},
error: function() {
alert("系统异常，请稍后再试！")
}
});
}
$(document).ready(function() {
get_app_type();
get_app_class();
});
</script>
</head>
<body>
<table>
<tr>
<td align="right">APP类型:</td>
<td align="left">
<select name="appType" id="appType"
style="margin-left: 16px; height: 30px; width: 110px; text-align: left; size: 3; color: #505050;">
<option value="-1">---请选择---</option>
</select>
</td>
</tr>
<tr height="25px"><td> </td></tr>
<tr>
<td align="right">APP种类:</td>
<td align="left">
<select name="appClass" id="appClass"
style="margin-left: 16px; height: 30px; width: 110px; text-align: left; size: 3; color: #505050;">
<option value="-1">---请选择---</option>
</select>
</td>
</tr>
</table>
</body>
</html>
struts .xml
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.1//EN" "http://struts.apache.org/dtds/struts-2.1.dtd">
<struts>
<constant name="struts.i18n.encoding" value="UTF-8"></constant>
<package name="simpleton" extends="struts-default,json-default">
<action name="*JsonAction" method="{1}"
class="jquery.chisj.action.JsonAction">
<result name="fail">error.jsp</result>
<result type="json">
<param name="root">result</param>
</result>
</action>
<action name="AppTypeShow"
class="jquery.chisj.action.NtAppAction"
method="appTypeShow">
<result name="fail">error.jsp</result>
<result type="json">
<param name="root">result</param>
</result>
</action>
<action name="AppClassShow"
class="jquery.chisj.action.NtAppAction"
method="appClassShow">
<result name="fail">error.jsp</result>
<result type="json">
<param name="root">result</param>
</result>
</action>
</package>
</struts>
NtAppAction.java
/**
*
*/
package jquery.chisj.action;
import java.util.ArrayList;
import java.util.List;
import jquery.chisj.entity.APPClass;
import jquery.chisj.entity.APPType;
import com.opensymphony.xwork2.ActionSupport;
import net.sf.json.JSONArray;
/**
* @ClassName: NtAppAction
* @Description: TODO
* @Author: chisj chisj@foxmail.com
* @Date 2016年1月20日 下午4:53:50
*/
public class NtAppAction extends ActionSupport {
private String result;
public String appTypeShow() {
System.out.println("---app type show---");
List<APPType> appTypeList = new ArrayList<APPType>();
try {
APPType appType_1 = new APPType();
APPType appType_2 = new APPType();
appType_1.setId(Short.valueOf("1"));
appType_1.setName("Android");
appType_2.setId(Short.valueOf("2"));
appType_2.setName("iOS");
appTypeList.add(appType_1);
appTypeList.add(appType_2);
JSONArray jsonArray = JSONArray.fromObject(appTypeList);
result = String.valueOf(jsonArray);
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}
public String appClassShow() {
System.out.println("---app class show---");
List<APPClass> appClassList = new ArrayList<APPClass>();
try {
APPClass appClass_1 = new APPClass();
APPClass appClass_2 = new APPClass();
appClass_1.setId(Short.valueOf("1"));
appClass_1.setName("种类1");
appClass_2.setId(Short.valueOf("2"));
appClass_2.setName("种类2");
appClassList.add(appClass_1);
appClassList.add(appClass_2);
JSONArray jsonArray = JSONArray.fromObject(appClassList);
result = String.valueOf(jsonArray);
} catch (Exception e) {
e.printStackTrace();
}
return SUCCESS;
}
public String getResult() {
return result;
}
public void setResult(String result) {
this.result = result;
}
}
I believe you have mastered the method after reading the case in this article, more Please pay attention to other related articles on the php Chinese website!
Recommended reading:
jQuery and vue make the verification code effect of drag verification
$.ajax() How to get json data from the server
The above is the detailed content of How to achieve dynamic acquisition of Jquery drop-down box data. For more information, please follow other related articles on the PHP Chinese website!
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn