SSM-jQuery

login.jsp

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
    request.setAttribute("basePath", basePath) ;
%>
<base href="<%=basePath%>">

<a href="page/user/listAll.action">登陸2</a>

userall.jsp

<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
    request.setAttribute("basePath", basePath) ;
%>

<script type="text/javascript" src="jquery/jquery.min.js"></script>
<script type="text/javascript" src="js/listall.js"></script>

<div align="center">
    <h6>顯示數據</h6>
    <hr>
    <h2>用戶信息表2</h2>
    <table id="userTable" border="1" width="50%">
        <tr>
            <th width="10%">編號</th>
            <th width="15%">姓名</th>
            <th width="15%">年齡</th>
            <th width="15%">性別</th>
            <th width="15">出生日期</th>
            <th width="15%">修改</th>
            <th width="15%">刪除</th>
        </tr>
    </table>
</div>

listall.js

$(function(){
    $.post("page/user/listUser.action",{},function(data){
        for(i = 0 ; i < data.allUser.length ; i++){
            userInfo =     "<tr>"+
                        "    <td width='10' align='center' id='user-"+ data.allUser[i].mid +"'>"+ data.allUser[i].mid  + "</td>" +
                        "    <td width='15' align='center' id='user-name-"+ data.allUser[i].mid + "'>" + data.allUser[i].name + "</td>" +
                        "    <td width='15' align='center' id='user-age-"+ data.allUser[i].mid + "'>" + data.allUser[i].age + "</td>" +
                        "    <td width='15' align='center' id='user-sex-"+ data.allUser[i].mid + "'>" + data.allUser[i].sex + "</td>" +
                        "    <td width='15' align='center' id='user-birthday-"+ data.allUser[i].mid + "'>" + new Date(data.allUser[i].birthday.time).format('yyyy-MM-dd') + "</td>" +
                        "    <td width='15' align='center'><a href='#'>修改</a></td>"+
                        "    <td width='15' align='center'><a href='#'>刪除</a></td>"+
                        "</tr>" ;
            $("#userTable").append(userInfo) ;
        };
    },"json");
});
Date.prototype.format = function(fmt) {
    var o = {
        "M+" : this.getMonth() + 1, //月份 
        "d+" : this.getDate(), //日 
        "h+" : this.getHours(), //小時 
        "m+" : this.getMinutes(), //分 
        "s+" : this.getSeconds(), //秒 
        "q+" : Math.floor((this.getMonth() + 3) / 3), //季度 
        "S" : this.getMilliseconds()
    //毫秒 
    };
    if (/(y+)/.test(fmt))
        fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "")
                .substr(4 - RegExp.$1.length));
    for ( var k in o)
        if (new RegExp("(" + k + ")").test(fmt))
            fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k])
                    : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
} 

UserAction.java

@Controller
@RequestMapping("/page/user/*")
public class UserAction {

    @Resource
    private IUserService userService;
    
    @RequestMapping("listUser")
    public void findAllUser(HttpServletResponse response) {
        List<User> allUser =new ArrayList();
        allUser = userService.findAll();
        //Map<String,List<User>> userMap = new HashMap<String,List<User>>();
        //userMap.put("userMap", allUser);
        JSONObject obj = new JSONObject();
        //obj.putAll(userMap);
        obj.put("allUser", allUser);
        response.setCharacterEncoding("UTF-8");
        try {
            response.getWriter().print(obj);
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
    
}

IUserService

public interface IUserService {
    
    public List<User> findAll();
    
}

UserServiceImpl

@Service
public class UserServiceImpl implements IUserService {

    @Resource
    private IUserDAO userDAO;
    
    @Override
    public List<User> findAll() {
        return userDAO.findAll();
    }

}

IUserDAO

public interface IUserDAO {
    
    public List<User> findAll();

}
 

User.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" 
"http://mybatis.org/dtd/mybatis-3-mapper.dtd"> 
<mapper namespace="cn.mldn.dao.IUserDAO"> 
    <resultMap type="User" id="UserMap">
        <id column="mid" jdbcType="VARCHAR" property="mid" javaType="String"/>
        <result column="big_name" jdbcType="VARCHAR" property="name" javaType="String"/>
        <result column="age" jdbcType="INTEGER" property="age" javaType="Integer"/>
        <result column="sex" jdbcType="VARCHAR" property="sex" javaType="String"/>
        <result column="birthday" jdbcType="TIMESTAMP" property="birthday" javaType="java.util.Date"/>
    </resultMap>
    <select id="findAll" resultMap="UserMap">
        SELECT mid,big_name,age,sex,birthday FROM users
    </select>
</mapper>  

User.java

    private String mid ;
    
    private String name ;
    
    private Integer age ;
    
    private String sex ;
    
    private Date birthday ;

users表

CREATE TABLE users(
    mid            VARCHAR(50) ,
    big_name    VARCHAR(50) ,
    age            INT ,            
    sex            VARCHAR(20) ,
    birthday    DATETIME ,
    CONSTRAINT PK_mid PRIMARY KEY(mid)
);