手把手教你用nodejs+SQL Server2012做增删改查

1.开发工具WebStorm 10.0.4

2.打开WebStorm 10.0.4新建项目：

ejs的特性：
    1、缓存功能，能够缓存已经解析好的html模版；
    2、<% code %>用于执行其中javascript代码；
    3、<%= code %>会对code进行html转义；
    4、<%- code %>将不会进行转义；
    5、支持自定义标签，比如'<%'可以使用'{{'，'%>'用'}}'代替；
    6、提供一些辅助函数，用于模版中使用
    7、利用<%- include filename %>加载其他页面模版；

可以根据个人喜好选择相应的模板

3.在app.js中：将圈起来的代码注释掉，写上箭头下的代码

 artTemplate不仅可以作为前端引擎，还可以作为后端引擎使用。
artTemplate是出色的javascript引擎，搭配出色的javascript运行时环境node.js一起使用，将会非常顺畅。

 

4.在Terminal下

完成这个后你的node_modules文件夹下会相应多出一个   art-template   文件夹，

5.配置你的dbHelper

6.和4 一样     npm install mssql

 

7.

 

8.users.js代码

var express = require('express');
var router = express.Router();
var dbHelper = require('../modules/utils/dbHelper.js');
/* GET home page. */
//查询所有用户信息
router.get('/', function(req, res, next) {
  dbHelper.selectAll('dbo.users',function(err,result){
    if(!err){
      res.render('users',{datas:result});
    }
  });
});
//执行删除
router.get('/delete/:id',function(req, res, next){
  var id=req.param("id");
  dbHelper.del("where id = @id",{id:id},"dbo.users",function(err,recordset){
    if(!err){
      //res.render('users',{datas:recordset});
      res.redirect('/users');
    }
    else{
      res.end();
    }
  });
});
//根据id拿信息
router.get('/toupdate/:id',function(req, res, next){
  var id=req.param("id");
  dbHelper.select("dbo.users",1,"where id=@id",{id:id},"order by id",function(err,recordset){
    if(!err){
      res.render('update',{datas:recordset});
    }
    else{
      res.end();
    }
  });
});
//执行修改
router.get('/update/:id/:name',function(req, res, next){
  var id=req.param("id");
  var name=req.param("name");
  dbHelper.update({name:name},{id:id},"dbo.users",function(err,recordset){
    if(!err){
      res.redirect('/users');
    }
    else{
      res.end();
    }
  });
});
//跳转到添加用户信息界面
router.get('/toaddurl',function(req,res,next){
  res.render('add');
});
//执行添加
router.get('/add/:name',function(req, res, next){
  var name=req.param("name");
  dbHelper.add({name:name},"dbo.users",function(err,recordset){
    if(!err){
      res.redirect('/users');
    }
    else{
      res.end();
    }
  });
});
module.exports = router;

9.users.html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户信息主页面</title>
</head>
<body>
<table>
    <tr>
        <th>编号</th>
        <th>姓名</th>
        <th>操作</th>
        <th><a href="/users/toaddurl">添加用户</a></th>
    </tr>
    {{each datas as value }}
    <tr>
        <td>{{value.id}}</td>
        <td>{{value.name}}</td>
        <td><a href="/users/delete/{{value.id}}">删除</a></td>
        <td><a href="/users/toupdate/{{value.id}}">修改</a></td>
    </tr>
    {{/each}}
</table>
</body>
</html>

10.update.html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>修改用户信息页面</title>
    <script type="text/javascript">
        function update(){
            var id = document.getElementById("id").value;
            var name = document.getElementById("name").value;
            window.location.href = "/users/update/" + id + "/" + name;
        }
    </script>
</head>
<body>
<table>
    <form method="post">
        {{each datas as val index}}
        <tr>
            <td><input type="hidden" value="{{val.id}}" id="id" /></td>
        </tr>
        <tr>
            <td>姓名:</td>
            <td><input type="text" id="name" value="{{val.name}}"></td>
        </tr>
        <tr>
            <td><input type="button" value="修改" onclick="javascript:update()"></td>
        </tr>
        {{/each}}
    </form>
</table>

</body>
</html>

11.add.html代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript">
        function update(){
            var name = document.getElementById("name").value;
            window.location.href = "/users/add/"+ name;
        }
    </script>
</head>
<body>
用户名称：
<input type="text"  id="name">
<input type="button" value="添加" onclick="javascript:update()">
</body>
</html>

12.最终页面

 

posted @ 2016-05-07 20:35  爱喝酸奶的吃货  阅读(4458)  评论(5)    收藏  举报