标签：
1.首页index.js
var express = require(‘express‘); var router = express.Router(); /* GET home page. */ router.get(‘/‘, function(req, res, next) { res.render(‘main‘, { title: ‘Express‘ }); }); module.exports = router;
2.main.html
<script>
var url;
function openTab(text, url, iconCls) {
if ($("#tabs").tabs("exists", text)) {
$("#tabs").tabs("select", text);
} else {
var content = "<iframe frameborder=0 scrolling=‘yes‘ style=‘width:100%;height:100%;‘ src=‘" + url + "‘></iframe>";
$("#tabs").tabs("add", {
title: text,
iconCls: iconCls,
closable: true,
content: content
})
}
}
function loginOut(){
$.messager.confirm(‘提示‘, ‘确定要退出登录吗？‘, function (r) {
if (r) {
window.location.href="/out";
}
});
}
</script>
<body class="easyui-layout">
<!--头部-->
<div class="top" region="north"><span class="title">后台管理系统</span><span class="out">欢迎 豆豆 登录 <a onclick="loginOut()" href="javascript:void(0)">退出</a></span></div>
<!--内容-->
<div region="center" style="overflow: hidden" id="center">
<div class="easyui-tabs" fit="true" id="tabs">
<div title="首页" data-options="iconCls:‘icon-home‘" id="main">
</div>
</div>
</div>
<!--左侧导航-->
<div region="west" style="width:200px; overflow-y:auto; overflow-x:auto;;height: 500px" title="导航菜单 " split="true">
<div class="easyui-accordion" data-options="fit:true,border:false">
<div title="测试" data-options="iconCls:‘icon-lock‘" style="padding:10px">
<a href="javascript:openTab(‘测试1‘,‘/users‘,‘icon-page_white_text_width‘)" class="easyui-linkbutton"
data-options="plain:true,iconCls:‘icon-page_white_text_width‘">测试1</a><br/>
</div>
</div>
</div>
</body>
3.users.js
var express = require(‘express‘); var router = express.Router(); var lottery= require(‘../modules/lotteryManage.js‘); /* GET users listing. */ router.get(‘/‘, function(req, res, next) { res.render(‘users‘); }); router.post(‘/list‘, function(req, res, next) { var rows = req.body.rows; var page = req.body.page; var phone = req.body.phone; var whereSql= req.body.names; var startTime = req.body.startTime; var endTime = req.body.endTime; lottery.getUserInfo(rows,page,phone,whereSql,startTime,endTime,function(err,result,total){ res.send({total: total, rows: result}); }); }); router.post(‘/update‘,function(req,res){ var uid=req.body.id; var unickName=req.body.nickname; var uqq=req.body.qq; var uAddress=req.body.address; lottery.editUserInfo(uid,unickName,uqq,uAddress,function(err,result1){ if(!err){ res.send("true"); }else { console.log(err); res.json("false"); } }); }); router.post(‘/delete‘,function(req,res){ var uid=req.body.id; lottery.delUserInfo(uid,function(err,result){ if(!err){ res.send("true"); }else { console.log(err); res.json({suc:false,errMsg:‘删除失败！‘}); } }); }); module.exports = router;
4.users.html
<script type="text/javascript"> var editIndex = undefined; function delDialog(){ var selectedRows=jQuery("#dg").datagrid(‘getSelections‘); if(selectedRows.length==0){ jQuery.messager.show({title:"提示",msg:"请选择要删除的内容！"}); return; } var strIds=[]; for(var i=0;i<selectedRows.length;i++){ strIds.push(selectedRows[i].id); } var ids=strIds.join(","); ids = ids.split(","); if (ids.length>0) { for(var i=0;i<ids.length;i++){ $.ajax({ type: ‘POST‘, url: "/users/delete", data: { id:ids[i]}, success: function (data) { if(data=="false"){ jQuery.messager.alert({title:‘提示‘,msg:result.errMsg}); } jQuery(‘#dg‘).datagrid(‘reload‘); // 重新载入当前页面数据 } }); } } else //如果没有删除数据，则提醒用户 { $.messager.alert(‘提示信息‘, ‘请选择你要删除的信息！‘, ‘warning‘); } } //保存按钮,多条数据一起提交 function save() { if (endEditing()) { //获取更新更改的行的集合 var row = $("#dg").datagrid(‘getChanges‘); //DataGrid的更该行为不为0 if (row.length) { for(var i=0;i<row.length;i++){ $.ajax({ type: ‘POST‘, url: "/users/update", data: { id:row[i].id,nickname:row[i].nickname,qq:row[i].qq,address:row[i].address}, success: function (data) { if(data=="false"){ $.messager.alert(‘提示信息‘, ‘保存失败‘); } $(‘#dg‘).datagrid(‘reload‘); // 重新载入当前页面数据 } }); } } else //如果没有修改数据，则提醒用户 { $.messager.alert(‘提示信息‘, ‘您还没有修改信息！‘, ‘warning‘); } } editIndex = undefined; } //撤销按钮 function reject() { row = $(‘#dg‘).datagrid(‘rejectChanges‘); editIndex = undefined; } //获取修改行数 function getChanges() { if (endEditing()) { var rows = $(‘#dg‘).datagrid(‘getChanges‘); alert(rows.length + ‘行被修改!‘); } } //单击事件 function onClickRow(index) { if (editIndex != index) { if (endEditing()) { $(‘#dg‘).datagrid(‘selectRow‘, index) .datagrid(‘beginEdit‘, index); //开始启用编辑 editIndex = index; //将正在编辑的行号赋值给变量 } else { $(‘#dg‘).datagrid(‘selectRow‘, editIndex); } } } //结束编辑 function endEditing() { if (editIndex == undefined) { return true } //校验指定的行，如果有效返回true if ($(‘#dg‘).datagrid(‘validateRow‘, editIndex)) { $(‘#dg‘).datagrid(‘endEdit‘, editIndex); //结束编辑 editIndex = undefined; return true; } else { return false; } } </script> <body> <table id="dg" title="测试1" class="easyui-datagrid" fitColumns="true" pagination="true" rownumbers="true" url="/users/list" fit="true" toolbar="#tb" data-options="iconCls: ‘icon-edit‘,onClickRow: onClickRow,pageSize:25,pageList:[10,15,25,50,100]"> <thead> <tr> <th field="cb" checkbox="true" align="center"></th> <th field="id" width="50" align="center" name="id">编号</th> <th field="nickname" width="50" align="center" name="nickname" data-options="editor:‘text‘" >昵称</th> <th field="phone" width="80" align="center" name="phone">联系方式</th> <th field="qq" width="50" align="center" name="qq" data-options="editor:‘numberbox‘">QQ</th> <th field="address" width="150" align="center" name="address" data-options="editor:‘text‘">地址</th> <th field="createTime" width="100" align="center">中奖时间</th> <th field="level" width="50" align="center" >奖品等级</th> <th field="jpname" width="100" align="center">奖品名称</th> </tr> </thead> </table> <div id="tb" style="height: auto"> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:‘icon-delete‘,plain:true" onclick="delDialog()">批量删除</a> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:‘icon-save‘,plain:true" onclick="save()">保存批量修改</a> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:‘icon-undo‘,plain:true" onclick="reject()">撤销</a> <a href="javascript:void(0)" class="easyui-linkbutton" data-options="iconCls:‘icon-search‘,plain:true" onclick="getChanges()">获取修改行</a> </div> </body>
标签：
原文地址：http://www.cnblogs.com/yingzi1028/p/5062728.html
