Ajax+jsp实现动态修改表格

ajax最大特点就是在页面不刷新的前提下实现页面内容的变换。

举个很常见的例子：比如有一个排行榜，这个排行榜肯定是随时变化的，我们希望用户不需要刷新页面的情况下就可以看到实时表格。（游戏排行榜，oj提交列表）

为了实现这个功能，我们需要掌握以下技术:ajax向后台提出请求(每隔很短的时间）------>jsp获取请求并查询数据库----->返回json格式数据----->js解析json格式数据并dom操作节点修改表单内容

流程:首先是编写触发函数（设置计时器或者点击事件），在触发函数中实现ajax的创建，然后实现ajax的回调函数，根据回调函数的内容进行相应的操作。

比如常见邮箱合理性验证可以在客户端实现，但是如果涉及到用户名是否使用过之类的，就必须要先启用ajax到服务端，在获取到返回的字符串后（比如该用户未被注册，或者该用户已被注册），通过dom操作打印到该页面（***.innerHTML=           )(***** .style.display="block"）

如果想要动态修改表单,除了触发事件不一样（合理性验证一般当失去焦点的时候，而像排行榜之类的就是每隔多少秒获取），还要在后台返回json格式的数据，客户端通过eval解析（注意两边要加上（）），

这边需要在lib文件夹下导入jsonarray和mysql的包,这里只有学生id和姓名两列。

login.jsp

%@ page language="java" import="java.util.*" contentType="text/html;charset=utf-8"%>

  
   
   
  
   
   
  

check.jsp

<%@page import="net.sf.json.JSONArray"%>
<%@ page language="java" import="java.util.*" contentType="text/html;charset=utf-8"%>  
<%@ page import="java.sql.*"%>
<%
    String driver = "com.mysql.jdbc.Driver";    
    String url = "jdbc:mysql://127.0.0.1:3306/ajax";    
    String use = "root";     
    String password = "960404";    
    Class.forName(driver);    
    Connection conn= DriverManager.getConnection(url,use,password);    
    PreparedStatement sql =conn.prepareStatement("select * from ajax_check");
    ResultSet rs=sql.executeQuery();
    List>list=new ArrayList>();
    while(rs.next()){
    Map map=new HashMap();
    map.put("id",rs.getString("student_id"));
    map.put("student_name",rs.getString("student_name"));
    list.add(map);
    }
    out.println(JSONArray.fromObject(list).toString());
    System.out.println(list);
    rs.close();
    conn.close();
%>

      

这样就可以边修改数据库内容，边观察到页面的变化了，当然你也可以再写个增删查改，然后看页面实时变化。