asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（三）—— 简单登录页面+sqlite+动软代码生成器的使用
上一节讲到利用easyui的layout、tree、tab和datagrid创建用户管理的页面，注意利用到easyui的页面一定要按顺序添加jQuery和easyUI的.js和.css样式，灵活查看easyui的帮助文档和demo，修改data-options选项。
下面开始登录页面，用到easyui的window。
1. 先新建一个account，里面放登录的页面，添加相应的控制器和视图：
（Account）Index的代码：
<body>
<div>
<div id="w" class="easyui-window" title="登录" data-options="iconCls:'icon-save', closable:false, minimizable:false, maximizable:false,
draggable:false, resizable:false, collapsible:false"
style="width:260px;height:160px;padding:10px;">
<table>
<tr>
<td>用户：</td><td><input id="name" type="text"/></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td>密码：</td><td><input id="pwd" type="text"/></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td></td><td><input type="button" onclick="" value="登录"/></td>
</tr>
<tr>
<td></td><td></td>
</tr>
</table>
</div>
</div>
</body>
为了运行方便，直接跳转到登录页面，可以修改下前面提到的Global.asax文件，把route改为Account-Index
运行效果：（运行的快捷键有两种，直接按F5，也就是debug模式，修改文件时需要终止调试；另一种是按Ctrl+F5，release模式，可以直接修改文件，修改后在浏览器页面刷新即可显示新的效果）
在easyui-window的data-options中，我们添加了很多参数，固定了窗口的样式，大小，不能拖拽等。如果不能成功显示，注意查看一下你的窗口文件中是否添加了easyui的script样式。
2. 构建数据库
先在本地项目web文件下的bin文件夹下，新建一个名为sqlite.db的文件：
再打开sqlite，就是长这个样子
新建数据库
数据库选中刚刚在本地新建的sqlite.db，别名这里命为usermanager，确定。
然后在数据库列表左边栏会出现usermanager，双击，展开表，右键，新建表
按图示新建字段并保存
注意！！！
这里必须注意，新建的表名不能和项目名一样，请修改为UserDB，和项目名同名会造成后来命名空间相同报错。
此时UserManager表格已经建好，在左边栏右键，选择最后一项，查询数据
现在新建的表是空白的，为表插入一条数据，即登录的数据。
现在表格里已经有了插入的数据了
3. 利用动软代码生成器，完善解决方案的Data、Business、Model层
打开动软
选择新增数据库服务器，类型选择sqlite，下一步
数据库文件选择我们在本地建的sqlite.db文件，输入本地地址
我的地址：D:\JennyJiang\MyProject\UserManager\UserManager.Web\bin\sqlite.db
然后点击连接字符串，本地保存该字符串Data Source=D:\JennyJiang\MyProject\UserManager\UserManager.Web\bin\sqlite.db
确定。
动软左边栏会生成如图所示的样子，连接上项目的数据库。
接着点击新建项目，选择简单三层结构，下一步
生成好后，动软会自动打开生成的项目。
4. 下面替换动软生成的项目文件到我们建好的项目中
① 替换UserManager.Model
删除.Model自带的Class1.cs，将动软代码中的UserManager.Model中的UserManager.cs复制粘贴过来，然后对本地的UserManager.Model右键生成，确保无错。
②替换UserManager.Data
同样，复制UserManager.DAL中的UserManager.cs复制粘贴过来，有错误一个一个修改，修改命名空间为UserManager.Data，然后引用System.Data.SQLite.dll
复制动软生成的DBUtility到本地文件夹，在解决方案中添加该项目
然后，在UserManager.Data的引用中引用项目，添加DBUtility和UserManager.Model
然后，为.Data生成，报错：DBUtility.DbHelperSQLite文件中，确实System.Data.SQLite,为DBUtility工程引用添加System.Data.SQLite.dll（这个dll在动软的Lib文件夹下已经存在），还要引用MySql.Data.dll
重新生成，但model报错了，但明明已经引用了model项目，感觉是项目名和数据库名相同，造成的，返回重新构造新的数据库，名为UserDB。
把动软生成的代码全部删除后，又重新为sqlite.db创建名为UserDB的表，然后动软代码生成，没有再报错了。
③替换UserManager.Business
复制粘贴动软生成的BLL文件夹下的UserDB.cs，然后添加引用Maticsoft.Common.dll（动软的Lib下也有，或者去网上下载），再添加Model和Data项目引用（注意！！！添加项目引用之前，必须为该项目生成，无错之后再添加引用）
至此，动软代码添加完毕，三层架构也已经完善。接下来的登录校验可以判断与数据库的内容是否相同。
5. 获取数据库里的内容，用于登录
在（Account）Index中获取db的数据，再在后台判断逻辑。这里在Scripts文件夹里新建.js文件，先新建Common文件夹，里面新建Login.js文件。
Login.js里的代码：
function Login() {
var name = $("#name").val();
var pwd = $("#pwd").val();
//前台逻辑判断
if (name == '' || pwd == '') {
$("#showInfo").html("用户名或密码为空");
}
else {
//后台逻辑判断
$.post("Account/DoLogin", { name: name, pwd: pwd },
function (data) {
//alert("Data Loaded: " + data);
if (data == "-1") {
$("#showInfo").html("用户名或密码为空");
}
else if (data == "-2") {
$("#showInfo").html("用户名或密码错误");
}
else {
$("#showInfo").html("登录");
}
});
}
}
同时需要修改（Account）Index页面，为登录button添加事件：
<body>
<div>
<div id="w" class="easyui-window" title="登录" data-options="iconCls:'icon-save', closable:false, minimizable:false, maximizable:false,
draggable:false, resizable:false, collapsible:false"
style="width:260px;height:160px;padding:10px;">
<table>
<tr>
<td>用户：</td><td><input id="name" type="text"/></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td>密码：</td><td><input id="pwd" type="text"/></td>
</tr>
<tr>
<td></td><td></td>
</tr>
<tr>
<td></td><td><input type="button" onclick="Login()" value="登录"/></td>
</tr>
<tr>
<td></td><td><label id="showInfo"></label></td>
</tr>
</table>
</div>
</div>
</body>
修改Account控制器代码：
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc; namespace UserManager.Web.Controllers
{
public class AccountController : Controller
{
//
// GET: /Account/ public ActionResult Index()
{
return View();
} UserManager.Business.UserDB users = new UserManager.Business.UserDB(); public ActionResult DoLogin()
{
int res = ;
string name = Request.Form["name"];
string pwd = Request.Form["pwd"];
//后台逻辑判断
if (string.IsNullOrEmpty(name) || string.IsNullOrEmpty(pwd))
{
res = -;
}
else {
//获取数据库内容
//List<UserManager.Model.UserDB> userList = new user
List<UserManager.Model.UserDB> userList = users.GetModelList("name='" + name + "'and pwd='" + pwd + "'");
if (userList.Count == )
{
res = -;
}
else
{
Session["user"] = userList[];
}
} return Content(res.ToString());
} }
}
同时，由于数据库，需要Web.config文件：
在<configuration>内添加：
<appSettings>
<!-- 连接字符串是否加密 -->
<add key="ConStringEncrypt" value="false"/>
<!-- 数据库连接字符串,（如果采用加密方式，上面一项要设置为true；加密工具，可在官方下载，
如果使用明文这样server=127.0.0.1;database=.....,上面则设置为false。 -->
<add key="ConnectionString" value="Data Source=D:\JennyJiang\MyProject\UserManager\UserManager.Web\bin\sqlite.db"/>
<!--其它模块连接字符串，可以不断增加以便同一个项目支持连接多个数据库。如果没有，可以删除该行-->
<add key="ConnectionString2" value="server=127.0.0.1;database=codematic2;uid=sa;pwd=1"/>
</appSettings>
其中“ConnectionString”的value为动软中生成的连接字符串。
最后，运行结果：
6. 为登录跳转到主页
在Login.js文件登录成功判断逻辑后面添加：
else {
$("#showInfo").html("登录");
window.location.href = "/Home/Index";
}
输入管理员用户和密码（即在构建数据库表时插入的信息），即可跳转到（Home）Index。
asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（三）—— 简单登录页面+sqlite+动软代码生成器的使用的更多相关文章
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅—— 摘要
首次接触asp.net开发,希望把自己的学习之旅写下来,一方面做个知识归纳技术总结,另一方面开放到博客中,和大家一起交流学习! asp.net是目前流行的web开发技术之一,是微软旗下开发的基于.ne ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（四）—— session传递登录人信息显示+用户注销
前面的学习,已经做好了简单的登录和主页,涉及了三层软件架构,mvc,easyui的layout.tree.tab.window,sqlite,动软代码自动生成. 下面完善一下登录跳转主页后,在sout ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（六）—— 简单过滤器的使用
有些同学喜欢在测试或运行项目时,直接跳转页面到Home/Index下,但本次项目直接输入Home/Index则会报错 因为home/index中有个user.name参数,如果启动项目后直接跳转到ho ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（二）—— easyui的简单实用
下面开始在UserManager.Web中利用easyUI构建web. 1. 先删除自带的controllers.models和views(里面的shared和web.config可以保存)下面的文件 ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（一）—— 手把手教你创建第一个三层架构+mvc的asp.net项目
下面开启项目 1. 打开vs2010-文件-新建项目 2. 先创建一个空的解决方案: 选择其他项目类型-visual studio 解决方案-空白解决方案(默认.NET Framework 4),项目 ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（七）—— 添加用户到数据库-obj转json
这一节讲一下如何添加用户名和密码到已建的sqlite.db数据库中. 当在datagrid的toolbar中输入用户名.密码,然后点击添加按钮时,将该用户加入数据库,并显示出来.datagrid表格里 ...
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅（五）—— 解决tabs选择已建tab显示但datagrid的toolbar消失的问题
项目需要反复运行,调整bug.发现在选择已有选项卡时,虽然不需要再新建tab,直接跳转到已有的tab上,但问题是显示的datagrid有事会出现toolbar消失的问题.网上也有不少同学出现类似问题, ...
- ASP.NET MVC+EasyUI+Entity FrameWork 整合开发
本文详细讲解怎么用ASP.NET MVC+EasyUI+Entity FrameWork 来开发一个项目 对于ASP.NET MVC的Jscript库,主要引用 <script type=.mi ...
- ASP.NET MVC +EasyUI 权限设计(二)环境搭建
请注明转载地址:http://www.cnblogs.com/arhat 今天突然发现博客园出问题了,老魏使用了PC,手机,平板都访问博客园了,都是不能正常的访问,原因是不能加载CSS,也就是不能访问 ...
随机推荐
- linux查看cpu内存信息
# 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 # 查看物理CPU个数 cat /proc/cpuinfo| ...
- HDU 3516 Tree Construction
区间$dp$,四边形优化. #pragma comment(linker, "/STACK:1024000000,1024000000") #include<cstdio&g ...
- Linux环境安装python3
linux 安装Python3 1.python下载 请在终端输入如下命令: cd /home wget http://cdn.npm.taobao.org/dist/python/3.6.5/Pyt ...
- POJ1679 The Unique MST(Kruskal)（最小生成树的唯一性）
The Unique MST Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 27141 Accepted: 9712 D ...
- RPD Volume 168 Issue 4 March 2016 评论7-end
Shielding activation of petawatt laser facilities in Romania: a FLUKA preliminary evaluation Abstr ...
- 理解XML-RPC
有关XML-RPC http://baike.baidu.com/link?url=ejidFtjelUzPv75VBm5_XrzSbHtFgArYY47S1s1NK2_m-auOr10sTeRh6U ...
- 【MySQL笔记】Excel数据导入Mysql数据库的实现方法——Navicat
很多公司尤其有点年头的公司,财务业务部门的各种表单都是excel来做的表格,随着互联网的发展各种业务流程都电子化流程化了,再在茫茫多的文档中去查找某一个年份月份的报告是件相当枯燥的事,所以都在想办法将 ...
- 手动编译含package的java源程序(包含外部包中定义的类)
1)定义一个GSM类,如下: 包名是“SRC.GSM”,并且此程序引用了外部jar包.使用javac命令对GSM.java进行编译: GSM.java所在的文件夹如下所示: 切换到这个目录为当前工作目 ...
- Androids中数据库的使用SQLite
(一) 知识点: SQLite3支持的数据类型:NULL,INTEGER,REAL(浮点数字),TEXT(字符串文本),BLOB(二进制对象),虽然他支持的类型只有五种,但实际上sqlite3也接受v ...
- Swift中获取相册图片与保存到相册
关于这个网上目前位置记录的资料比较少,记录一下这个坑 获取相册图片 1: var iPC = UIImagePickerController() 2: iPC.sourceType = UIImage ...