Luxnk
/
nutzDemo


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
							<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2018/3/19 0019
  Time: 16:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户列表</title>
    <script src="${base}/rs/js/jquery-1.8.3.min.js"></script>
</head>
<body>
    <div>
        <form action="#" id="user_query_form">
            条件<input type="text" name="username" />
            页数<input type="text" name="pageNumber" value="1" />
            每页条数<input type="text" name="pageSize" value="10" />
        </form>
        <button type="button" id="user_query_btn">查询</button>
        <p>---------------------------------------------------</p>
        <p id="user_count"></p>
        <div id="user_list"></div>
    </div>
    <div>
        <p>---------------------------------------------------</p>
    </div>
    <div id="user_add">
        <form action="#" id="user_add_form">
            用户名<input type="text" name="username" />
            密码<input type="password" name="password" />
        </form>
        <button type="button" id="user_add_btn">新增</button>
    </div>

    <script>
        var pageNumber = 1;
        var pageSize = 10;
        var base = '<%=request.getAttribute("base")%>';
        function user_reload() {
            $.ajax({
                url: base + '/user/query',
                data: $('#user_query_form').serialize(),
                dataType: 'json',
                success: function (data) {
                    console.log(data);
                    $('#user_count').html('共' + data.pager.recordCount + '个用户，总计' + data.pager.pageCount + '页');
                    var list_html = '';
                    console.log(data.list);
                    for (var i=0; i < data.list.length; i++) {
                        var user = data.list[i];
                        console.log(user);
                        var tmp = '\n<p>' + user.id + ' ' + user.username
                            + '<button onclick="user_update(\'' + user.id + '\');">修改</button>'
                            + '<button onclick="user_delete(\'' + user.id + '\');">删除</button>'
                            + '</p>';
                        list_html += tmp;
                    }
                    $('#user_list').html(list_html);
                }
            });
        }
        $(function () {
            user_reload();
            $('#user_query_btn').click(function () {
               user_reload();
            });
            $('#user_add_btn').click(function () {
                $.ajax({
                    url: base + '/user/add',
                    data: $('#user_add_form').serialize(),
                    dataType: 'json',
                    success: function (data) {
                        if (data.ok) {
                            user_reload();
                            alert('添加成功');
                        } else {
                            alert(data.msg);
                        }
                    }
                })
            });
        });
        function user_update(userId) {
            var passwd = prompt('请输入新的密码');
            if (passwd) {
                $.ajax({
                    url: base + '/user/update',
                    data: {'id': userId, 'password': passwd},
                    dataType: 'json',
                    success: function (data) {
                        if (data.ok) {
                            user_reload();
                            alert('修改成功');
                        } else {
                            alert(data.msg);
                        }
                    }
                });
            }
        }
        function user_delete(userId) {
            var s = prompt('请输入y确认删除');
            if (s == 'y') {
                $.ajax({
                    url: base + '/user/delete',
                    data: {'id': userId},
                    dataType: 'json',
                    success: function (data) {
                        if (data.ok) {
                            user_reload();
                            alert('删除成功');
                        } else {
                            alert(data.msg);
                        }
                    }
                })
            }
        }
    </script>
</body>
</html>