ThinkJS入门学习实例（3）
完整示例代码：
五、数据库增删查改
- 5.1. 查询
首先，我们把think_brand的所有信息显示到首页home/index/index：
View：
<table id="table" cellspacing="0" width="100%">
<thead>
<tr>
<% if(isLogin){ %>
<th>*</th>
<% } %>
<th>Name</th>
<th>Price</th>
</tr>
</thead>
<tbody>
<% brand.forEach(function(item) { %>
<tr>
<% if(isLogin){ %>
<td><a href="/admin/index/update?id=<%= item.id %>">修改</a> - <a href="/admin/index/del?id=<%= item.id %>">删除</a></td>
<% } %>
<td><a target="_blank" href="<%= item.url %>"><%= item.name %></a></td>
<td><img src="/upload/<%= item.img %>" alt="<%= item.name %>"/></td>
</tr>
<% }); %>
</tbody>
</table>Controller:
App/Lib/Controller/Home/IndexController.js
//首页
indexAction: function () {
//获取登录信息
var userInfo = this.userInfo;
var self = this;
if (!isEmpty(userInfo)) {
var brandModel = D('Brand');
var brandData = [];
//将用户信息赋值到模版变量里，供模版里使用
brandModel.getBrand().then(function (data) {
userInfo.name === 'admin' ? brandData = data : brandData = [];
self.assign({'title': '管理-首页', 'brand': brandData, 'user': userInfo});
return self.display();
});
}
}- 5.2. 增加
View：
<form id="add-form" action="/admin/index/addBrand" method="POST" enctype="multipart/form-data">
<h5>新增品牌</h5>
<div class="form-group">
<input class="form-control" type="text" id="name" name="name" placeholder="brand name"/>
</div>
<div class="form-group">
<input type="file" name="img" id="img" placeholder="upload brand image"/>
</div>
<div class="form-group">
<input class="form-control" type="text" id="url" name="url" placeholder="brand url"/>
</div>
<button class="btn btn-primary" type="submit">Submit</button>
</form>因为这里需要上传图片，所以form一定不能漏了enctype属性：multipart/form-data，以保证被发送到服务器的数据不会被编码。
Controller：
//添加
addAction: function() {
var self = this;
var where = {
name: ''
};
if (self.isPost()) {
var brandModel = D('Brand');
var pData = self.post();
//获取上传的图片文件
var vBImg = self.file('img');
//利用上传图片的name和path属性
var finalFileName = this.utilUploadImg(pData.name, vBImg.path);
where.name = pData.name;
//保存数据到数据库
pData.img = finalFileName;
brandModel.thenAdd(pData, where, true).then(function(insertId) {
if (insertId.type === 'add') {
return self.redirect('/home/index/index');
} else {
return self.error(insertId.type);
}
});
} else {
self.assign({
'title': '管理-新增品牌'
});
return self.display();
}
},
//图片上传
utilUploadImg: function(upImgName, upImgPath) {
var extension = '';
var finalFileName = '';
//处理后缀和文件名
upImgPath.indexOf('png') !== -1 ? extension = '.png' : extension = '.jpg';
finalFileName = new Date().getTime() + extension;
//读取文件
fs.readFile(upImgPath, function(err, data) {
if (err) {
console.log('There was an error when reading file');
} else {
//写入文件到uplaod
fs.writeFile('upload/' + finalFileName, data, function(err) {
if (err) {
console.log('There was an error when write file');
} else {
console.log('saved');
}
});
}
});
return finalFileName;
}上传的图片会被保存到www/upload下，以品牌的name来命名。
注意这里的fs需要先引用node JS fs模块：
var fs = require('fs');- 5.3. 删除
Controller：
App/Lib/Controller/Admin/IndexController.js
//删除
delAction: function () {
var self = this;
if (self.isGet()) {
//获取id
var id = this.get('id');
D('item').where({id: id}).delete().then(function (affectedRows) {
if (affectedRows > 0) {
return self.redirect('index');
}
});
}
}根据id查找并删除对应项。
- 5.4. 修改
View
App/View/Admin/index_update.html
<form action="/admin/index/update" method="POST" enctype="multipart/form-data">
<input type="hidden" name="id" value="<%= brand.id %>"/>
<div class="form-group">
<input class="form-control" type="text" name="name" value="<%= brand.name %>"/>
</div>
<div class="form-group">
<input type="file" name="img"/>
<p class="help-block"><%= brand.img %></p>
</div>
<div class="form-group">
<input class="form-control" type="text" name="url" value="<%= brand.url %>"/>
</div>
<button class="btn btn-primary" type="submit">Submit</button>
</form>Controller：
App/Lib/Controller/Admin/IndexController.js
//修改
updateAction: function() {
var self = this;
var id = 0;
//GET数据
if (self.isGet()) {
//获取name值
id = self.get('id');
D('Brand').where({
id: id
}).find().then(function(theBrand) {
self.assign({
'title': '管理-修改',
'brand': theBrand
});
self.display();
});
} else if (self.isPost()) {
//POST数据
var updateData = self.post();
var vBImg = self.file('img');
// 如果没有更改图片， 防止上传空文件
if (vBImg.originalFilename !== '') {
var finalFileName = this.utilUploadImg(updateData.name, vBImg.path);
updateData.img = finalFileName;
}
id = self.post('id');
D('Brand').where({
id: id
}).update(updateData).then(function(affectedRows) {
if (affectedRows > 0) {
return self.redirect('/home/index/index');
}
});
}
}根据id查找并修改对应项。
未完待续。。。
水平有限，如果文章有啥错误，还请不吝赐教 :)
