Ajax前后台传值小demo

最新推荐文章于 2021-08-06 18:00:59 发布

thepeakofmountain

最新推荐文章于 2021-08-06 18:00:59 发布

阅读量8.1k

点赞数 1

分类专栏： Ajax 文章标签： jquery ajax servlet

本文链接：https://blog.csdn.net/thepeakofmountain/article/details/18146649

版权

这篇博客通过一个简单的Ajax demo演示了如何从前台到后台传递数据。使用JDBC从数据库获取数据并在表格中展示，通过jQuery的Ajax与Servlet进行交互。文中详细介绍了在实现过程中遇到的问题，如直接在Servlet中跳转的不可能性、dataType的选择及其影响，并提供了dataType的说明。文章旨在帮助读者理解Ajax的工作原理和实践中的注意事项。

摘要由CSDN通过智能技术生成

本篇的demo总体实现了一个Ajax从前台到后台的交互的模拟功能，具体的情况是利用在前台动态以表格显示数据，每一行有一个复选框，然后利用servlet模拟在后台取出从前台传过来的主键值，其中在servlet中可以对数据进行增删改的功能，此处为模拟，并未对数据修改，然后返回一个json数组，ajax成功执行时时跳转到另外一个页面并获得所传的值。

首先看程序运行的结果，url如下:http://localhost:8080/effective/taskExp.jsp

点击cancel按钮，跳转的url为

http://localhost:8080/effective/index.jsp?result=[9,10,44]

首先看web项目的目录结构

前台的taskExp.jsp的核心代码如下，利用JDBC从数据库中读取数据，然后在前台以table的方式显示数据，

 <%  
    Connection ct = null;  
    PreparedStatement ps = null;  
    ResultSet rs = null;  
    String DRIVER = "com.mysql.jdbc.Driver";  
    String URL = "jdbc:mysql://localhost:3306/test";  
    String USERNAME = "root";  
    String PASSWD = "";
    
      
    List<OrderDetail> orderDetailList = new ArrayList<OrderDetail>();   
    String doflag  = request.getParameter("doflag");  
    if(doflag==null||doflag.length()==0) {  
        try {  
            Class.forName(DRIVER);  
            ct = DriverManager.getConnection(URL, USERNAME, PASSWD);  
                String sql = "select * from orddetail";  
                ps = ct.prepareStatement(sql);  
                rs = ps.executeQuery();  
                while(rs.next()) {  
                    OrderDetail orderDetail = new OrderDetail();  
                    orderDetail.setId(rs.getInt("id"));  
                    orderDetail.setOrderId(rs.getStrin