nodejs 批量修改、刪除

1.首頁index.jsjavascript

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.htmlhtml

   <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">歡迎&nbsp;&nbsp;豆豆&nbsp;&nbsp;登陸&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<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.jsjava

 

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.htmlajax

    <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>
相關文章
相關標籤/搜索