MVC 【Razor 视图引擎】案例分析

最新推荐文章于 2024-10-31 13:48:35 发布

weixin_30384217

最新推荐文章于 2024-10-31 13:48:35 发布

阅读量102

点赞数

文章标签：测试 javascript json ViewUI

原文链接：http://www.cnblogs.com/Tanghongchang/p/7128573.html

版权

using MvcApplication1.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication1.Controllers
{
    public class LoginController : Controller
    {
        //
        // GET: /Login/


        // 登录视图
        public ActionResult Index()
        {
            return View();
        }


        // 登录验证
        public ActionResult YanZheng(string uname, string pwd)
        {

            bool b = new UsersData().SelectUser(uname, pwd);
            if (b)
            {
                Response.Cookies["user"].Value = uname;
                Response.Cookies["user"].Expires = DateTime.Now.AddDays(3);

                return RedirectToAction("Index", "Home");
            }
            else
            {
                TempData["loginerror"] = "用户名密码错误";
                return RedirectToAction("Index", "Login");
            }

        }

    }
}

登录控制器

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        @{using (Html.BeginForm("YanZheng", "Login"))
          {
            @:用户名：<input type="text" name="uname" /><br />
            @:密码：<input type="password" name="pwd" /><br />
            <input type="submit" value="登录" />
              if (TempData["loginerror"] != null)
              {
            <div style="color: red;">@TempData["loginerror"]</div>
              }
          }
        }
    </div>
</body>
</html>

登录视图

--------------------------------------------

using MvcApplication1.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication1.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/




        //展示方法
        public ActionResult Index()
        {
            //判断是否登录，有登录信息展示
            if (Request.Cookies["user"] != null)
            {
                return View();
            }
            else
            {    //无登录信息返回原视图
                return RedirectToAction("Index", "Login");
            }
        }

        //添加视图
        public ActionResult Insert()
        {
            return View();
        }


        //添加方法
        //界面上 name 取的名 与字段名一样 会自动拼成匹配的对象
        public ActionResult Insert1(Users u)
        {
            new UsersData().Insert(u);
            return RedirectToAction("Index");
        }


        //修改 接收传值
        public ActionResult Update(string id)
        {
            Users u = new UsersData().SelectUser(id);
            if (u != null)
            {
                return View(u);
            }
            else
            {
                return RedirectToAction("index", "Home");
            }
        }


}

展示，修改，添加控制器

@{
    Layout = null;
}
@using MvcApplication1.Models;
                               @*引用命名空间*@

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        <h1>这是Razor语法出来的视图主界面</h1>

        <table style="width: 100%; text-align: center; background-color: navy;">
            <tr style="color: white;">
                <td>用户名</td>
                <td>密码</td>
                <td>昵称</td>
                <td>性别</td>
                <td>生日</td>
                <td>民族</td>
                <td>操作</td>
            </tr>

            @{
                List<Users> ulist = new UsersData().SelectAll();

                foreach (Users u in ulist)
                {

                <tr style="background-color: white;">
                    <td>@u.UserName</td>
                    <td>@u.PassWord</td>
                    <td>@(u.NickName)同学</td>
                    <td>@(u.Sex == true ? "男" : "女")</td>
                    <td>@u.Birthday.Value.ToString("yyyy年MM月dd日")</td>
                    <td>@u.UserNation.NationName</td>

                    <td>@Html.ActionLink("修改", "Update/" + u.Ids, "Home") </td>
                                                             @*修改--在动作后面接 传的值*@    
                </tr>
                }
            }

        </table>
        @Html.ActionLink("添加hehe", "Insert", "Home")     
                                                             @*使用超链接添加*@

        <input type="button" value="添加新用户" id="btn1" />
                                                             @*使用普通按钮添加*@
    </div>
</body>
</html>

<script type="text/javascript">

    document.getElementById("btn1").onclick = function () {
        window.location.href = "@Url.Action("Insert", "Home")";

    }                                 @*使用普通按钮添加----方法*@


</script>

展示视图

@{
    Layout = null;
}
@using MvcApplication1.Models;
                                 @*引用命名空间*@

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Insert</title>
</head>
<body>
    <div>
        <h1>添加新用户</h1>

        @{ using (Html.BeginForm("Insert1", "Home", "post"))
           
           {
               
            @:用户名：<input type="text" name="username" /><br />
            @:密码：<input type="text" name="password" /><br />
            @:昵称：<input type="text" name="nickname" /><br />
            @:性别：
            <input type="radio" value="True" id="r1" name="sex" checked="checked" /><label for="r1">男</label>
            <input type="radio" value="False" id="r2" name="sex" /><label for="r2">女</label>
            <br />
            @:生日：<input type="text" name="birthday" /><br />
            @:民族：
            <select name="nation">
                @{
               List<UserNation> unlist = new UserNationData().SelectAll();

               foreach (UserNation un in unlist)
               {
                    <option value="@un.NationCode">@un.NationName</option>
               }        
                    
                }
            </select>
            <br />
            
            
            <div id="div1" style="width: 100px; height: 100px; background-color: red;">保存</div>
            
            <input type="button" value="保存" id="btn1" />
            
            
           }
        }


    </div>
</body>
</html>
<script type="text/javascript">
    document.getElementById("div1").onclick = function () {
        this.parentNode.submit();
                                    //点击div时 提交

    }
    document.getElementById("btn1").onclick = function () {
        this.form.submit();

    }                               //普通按钮提交 



</script>

添加视图

@{
    Layout = null;
}
@using MvcApplication1.Models;
                               @*引用命名空间*@

@model Users      
                              @* 声明传进来的强类型的数据类型*@

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Update</title>
</head>
<body>
    <div>
        @{ using (Html.BeginForm("Update1", "Home", "post"))
           {
            @:用户名：<input type="text" disabled="disabled" name="username" value="@Model.UserName" /><br />
            @:密码：<input type="text" name="password" value="@Model.PassWord" /><br />
            @:昵称：<input type="text" name="nickname" value="@Model.NickName" /><br />
            @:性别：

            <input type="radio" value="True" id="r1" name="sex" @(Model.Sex == true ? "checked='checked'" : "") /><label for="r1">男</label>
            <input type="radio" value="False" id="r2" name="sex" @(Model.Sex == false ? "checked='checked'" : "") /><label for="r2">女</label>

            <br />
            @:生日：<input type="text" name="birthday" value="@Model.Birthday.Value" /><br />
            @:民族：
            <select name="nation">
                @{
               List<UserNation> unlist = new UserNationData().SelectAll();

               foreach (UserNation un in unlist)
               {
                    <option @(un.NationCode == Model.Nation ? "selected='selected'" : "") value="@un.NationCode">@un.NationName</option>
               }        
                    
                }
            </select>
            <br />
            
            <div id="div1" style="width: 100px; height: 100px; background-color: red;">保存</div>
               //用 div 提交
            
            <input type="button" value="保存" id="btn1" />
               //用普通按钮提交

           }
        }
    </div>
</body>
</html>
<script type="text/javascript">
    document.getElementById("div1").onclick = function () {
        this.parentNode.submit();
                                       //用 div 提交
    }
    document.getElementById("btn1").onclick = function () {
        this.form.submit();
                                      //用普通按钮提交    
    }

</script>

修改视图

--------------

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Test1</title>
    <script src="~/js/jquery-1.7.1.min.js"></script>
</head>
<body>
    <div>

        <input type="text" id="txt1" name="t1" />
        <input type="button" value="验证" id="btn1" />

    </div>
</body>
</html>

<script type="text/javascript">

    $("#btn1").click(function () {
        $.ajax({
            url: "/ajax/aaa.ashx", data: { "t": $("#txt1").val() }, type: "post", dataType: "json",
            success: function (msg) {
                if (msg.ok == "0") {
                    alert("可用");
                }
                else {
                    alert("抱歉，已被占用！！");
                }

            }
        });

    });

</script>

番外--用AJAX验证

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using MvcApplication1.Models;

namespace MvcApplication1.ajax
{
    /// <summary>
    /// aaa 的摘要说明
    /// </summary>
    public class aaa : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            string end = "{\"ok\":\"0\"}";
            string uname = context.Request["t"];

            using (DataClasses1DataContext con = new DataClasses1DataContext())
            {
                Users u = con.Users.Where(r => r.UserName == uname).FirstOrDefault();
                if (u != null)
                {
                    end = "{\"ok\":\"1\"}";
                
                }
            }
            context.Response.Write(end);
            context.Response.End();
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}