基于jquery的异步提交例子
后台代码一、
?/**
? * 得到大类的数据
? * @param request
? * @param response
? */
?private void getParentGory(HttpServletRequest request,
???HttpServletResponse response) {
??System.out.println("the process is comming!!");
??response.setCharacterEncoding("utf-8");
??response.setHeader("Cache-Control", "no-store");
??response.setHeader("Pragma", "no-cache");
??response.setDateHeader("Expires", 0);
??PrintWriter out = null;
??String str = "";
??try {
???out = response.getWriter();
???String sql = "select * from t_artType where parentid=0 order by typeId desc";
???ResultSet rs = BaseDaoSuport.getInstence().getList(sql, null);
???List<ArtType> list = new ArrayList<ArtType>();
???while (rs.next()) {
????artype = new ArtType();
????artype.setDataByRs(rs, artype);
????list.add(artype);
???}
???Iterator<ArtType> iter = list.iterator();
???while (iter.hasNext()) {
????ArtType artype = iter.next();
????str += artype.getTypeId() + "," + artype.getTypeName() + "|";
???}
??} catch (Exception e) {
???e.printStackTrace();
??}
??out.print(str);
??out.close();
?}
?
后台代码二、
/**
? * 得到小类的数据
? *
? * @param request
? * @param response
? */
?private void getChildGory(HttpServletRequest request,
???HttpServletResponse response) {
??System.out.println("the process is comming!!");
??response.setCharacterEncoding("utf-8");
??response.setHeader("Cache-Control", "no-store");
??response.setHeader("Pragma", "no-cache");
??response.setDateHeader("Expires", 0);
??PrintWriter out = null;
??String str = "";
??try {
???out = response.getWriter();
???int parentId = Integer.parseInt(request.getParameter("parentId"));
???String sql = "select * from t_artType where parentid=" + parentId
?????+ " order by typeId desc";
???ResultSet rs = BaseDaoSuport.getInstence().getList(sql, null);
???List<ArtType> list = new ArrayList<ArtType>();
???while (rs.next()) {
????artype = new ArtType();
????artype.setDataByRs(rs, artype);
????list.add(artype);
???}
???Iterator<ArtType> iter = list.iterator();
???while (iter.hasNext()) {
????ArtType artype = iter.next();
????str += artype.getTypeId() + "," + artype.getTypeName() + "|";
???}
??} catch (Exception e) {
???e.printStackTrace();
??}
??out.print(str);
??out.close();
?}
前台js异步提交代码
得到大类的数据:
function getBigcategory() {
?//alert(typecode);
?$.get("ArtTypeServlet?status=getParentGory", null, getParentGory_callback);
}
function getParentGory_callback(data) {
?var big = data.split("|");
?var bigcategory = document.getElementById("bigCategory");
?//alert(smallselect);
?bigcategory.length = big.length - 1;
?for ( var i = 0; i < bigcategory.length; i++) {
??var ss = big[i].split(",");
??bigcategory.options[i].text = "---"+ss[1]+"---";
??bigcategory.options[i].value = ss[0];
?}
}
function getSmallcategory(parentId) {
?//alert(typecode);
?$.get("ArtTypeServlet?status=getChildGory", {
??parentId : parentId
?}, getChildGory_callback);
}
function getChildGory_callback(data) {
?var small = data.split("|");
?var smallcategory = document.getElementById("smallCategory");
?//alert(smallselect);
?smallcategory.length = small.length - 1;
?for ( var i = 0; i < smallcategory.length; i++) {
??var ss = small[i].split(",");
??smallcategory.options[i].text = "---"+ss[1]+"---";
??smallcategory.options[i].value = ss[0];
?}
}
?
页面代码
<td style="height: 28px; width: 200px;" align="left" >
????????????????????? <select id="bigCategory" onclick="getSmallcategory(this.value)" name="bigCategory" style="width: 150px; height:30px;font-size:20px;border:1px teal solid">
????????????????????????? <option? value="请选择" selected="selected">--请选择--</option>
?????????????????????? </select>
????????? </td>
????????? <td style="height: 28px; width: 146px;" align="left">
????????????????????? <select id="smallCategory" name="artTypeId" style="width: 150px; height:30px;font-size:20px;border:1px teal solid">
????????????????????????? <option value="请选择" selected="selected">--请选择--</option>
?????????????????????? </select>
????????? </td>