基于jquery的异步提交例子
2019独角兽企业重金招聘Python工程师标准>>>
后台代码一、
/**
* 得到大类的数据
* @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;" class="style1">文章所属板块</td>
<td style="height: 28px;" class="style6" align="left" >
<select id="bigCategory" οnclick="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;" class="style1">板块类型</td>
<td style="height: 28px;" class="style6" 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>
转载于:https://my.oschina.net/lushuifa/blog/1545949
基于jquery的异步提交例子相关推荐
- struts2+Jquery+Json异步提交(传递复杂JSON对象)
最近,在使用Struts2+Jquery实现异步提交传递复杂JSON对象时候,遇到了各种问题,经过各方的不懈努力,最终找到了解决方案,记录下以备忘. 基础知识 JSON建 ...
- jquery ajaxSubmit 异步提交
jquery 的ajaxSubmit 异步提交 前台js $("#nickForm").ajaxSubmit({ type: "post", ...
- ajax send报错,jquery ajax beforeSend 提交等待问题
需要使用异步加载async : true 否则不会出现等待效果 $.ajax({ url : $('#form').attr("action"), data: $('#form') ...
- jquery 上传图片 java_jquery 异步提交表单 上传图片小例子
这次做ecshop项目用到了一些小东西,这里我就把在项目中用到的一个异步上传多个产品图片的小东西,不是多好,但是是我自己查资料搞出来的.放这里,给自己和大家一个参考,欢迎丢砖!(jquery+spri ...
- 【转】4.2使用jQuery.form插件,实现完美的表单异步提交
传送门:异步编程系列目录-- 示例下载:使用jQuery.form插件,实现完美的表单异步提交.rar 抓住6月份的尾巴,今天的主题是 今天我想介绍的是一款jQuery的插件:Jquery.form. ...
- php ajax勾选框提交,jQuery选取所有复选框被选中的值并用Ajax异步提交数据的实例...
昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...
- jquery复选框组清空选中的值_jQuery选取所有复选框被选中的值并用Ajax异步提交数据...
昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...
- 一款基于jquery ui的动画提交表单
今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览 源码下载 实现的代码. html代码: & ...
- jQuery.Form.js 异步提交表单使用总结
jQuery.Form.js 是一个用于使用jQuery异步提交表单的插件,它使用方法简单,支持同步和异步两种方式提交. 第一步:引入jQuery与jQuery.Form.js 1 <scrip ...
最新文章
- 如何快速写一个违背双亲委托机制的classloader
- Open-falcon运维监控系统——微信接口二次开发
- 2020 诺贝尔奖「第一棒」:英美三位科学家摘得桂冠!
- border-radius的使用 css样式
- c# Application.DoEvents
- boost::int64_t模块int64 范围的测试程序
- php 静态扩展,thinkphp5行为扩展实现html静态缓存设置
- (四) shiro权限与角色
- centos6.5搭建php网站,Centos6.5下搭建web环境(Apache+mysql+php+phpMyAdmin)
- leetcode 131. 分割回文串 思考分析
- php div边框,CSS自定义边框
- Linux内核中断引入用户空间(异步通知机制)【转】
- ClickHouse到底有什么本事呢?互联网公司如此追捧
- (转)pycharm快捷键
- python之列表生成式
- python实现人脸检测及识别(2)---- 利用keras库训练人脸识别模型
- Shutdown In Period 1.0
- PAT 考试是什么?
- 1KB文件夹快捷方式病毒解决方法
- Ubuntu 18.04 安装搜狗拼音输入法出现乱码的
热门文章
- cdn搭建原理_直播平台搭建并不难,最难的是这两点
- 20190807:排序数组删除重复项
- 计数 APP android,SharedPreferences初学~个人备忘录以及对进入APP的次数进行计数
- layui.use 在a标签内onclick调用
- 如何选择合适的加密芯片
- 通用业务平台设计(二):扩展多国家业务
- SpringBoot实战(七):替代if的优雅方案,提高程序扩展性
- 8种寻找机器学习数据集的方法 | 附数据集资源
- 拿到软银巨额投资后,通用无人车部门Cruise可能要单独IPO了
- ROS 2正式版终于来了,还增加了这些新特性