上一篇博客 MVC系列之——入门 为大家简单的介绍一下MVC的工作原理,这篇文章通过一个实例来为大家看看他到底是怎么一步一步的进行!
首先让我们新建一个工程,选择web 下的ASP.NET MVC3 Web应用程序,然后选择空模板,视图引擎选择Razor。
在单击确定以后会看到资源管理器中,这个结构就是MVC项目的基本结构,也是最简单的结构。Content 文件夹中包含的是一些常用css文件。Controllers文件夹是放一些控制器!用来处理业务逻辑!Model中用来存放实体类。Scripts文件夹中放的是常用的js文件。Views文件夹存放视图,说白了就是页面!
然后右键单击Controllers,选择添加,然后选择控制器。添加控制器默认名字为DefaultController ,我们更改为HomeController。这里要注意控制器的名字一定是…..Controller。
我们添加的控制器的代码为:
namespace MyMvcDemo.Controllers
{
public class HomeController : Controller
{
/// <summary>
/// 默认的方法, 通过路由机制默认请求道这个这个方法 进行处理
/// </summary>
/// <returns></returns>
public ActionResult Index()
{
return View();
}
}
}
然后选中index 右键单击,选择添加视图,然后点击确定。在Views文件夹下就会出现Home文件夹,Home文件夹下回出现index.cshtml视图!
然后点击该视图,并为该视图添加如下代码。
@{
ViewBag.Title = "Index";
}
<script type="text/javascript">
//登录方法
function login() {
//获取输入的用户名 密码
var username = document.getElementById("username").value.toString();
var password = document.getElementById("password").value.toString();
//请求的地址
var url = '/userlog/login'
//请求的地址+ 参数作为新的请求地址 url和第一个参数之间切记不能有空格
window.location.href = url + "?username=" + username + "&password=" + password;
}
//退出方法
function logout() {
window.close();
}
</script>
<h2>登录页</h2>
<div>
<p>用户名:<input type ="text" id="username" /></p>
<p>密 码: <input type ="text" id="password" /></p>
</div>
<div>
<p><input type="button" value="登录" name="登录" οnclick="login()"/></p>
<p><input type="button" value="退出" name="退出" οnclick="logout()"/></p>
</div>
在HomeController中添加一个方法,名为Login,然后添加一个对应的视图! 并在Login方法中添加如下代码!
/// <summary>
/// 登录
/// </summary>
/// <returns></returns>
public ActionResult Login()
{
//获取url中的参数
var userName = Request.QueryString["username"].ToString();
var passWord = Request.QueryString["password"].ToString();
//验证用户名密码 是否正确
//应该去数据库验证,但是为了说明 就简单的进行判断了!
if ("hongjie" != userName || "hongjie" != passWord)
{
//如果登录不成功,那么返回到登录页
return Index();
}
//如果登录成功进入到login页面
return View();
}
这样直接启动,就可以登录到登录页了,然后输入相应的用户名,密码,就可以进入到主页中了!
通过这个小例子,相信对MVC的简单的操作是没有问题了!接下来还会继续学习,并会有陆续的博客推出 ,请关注!