MVC 【Razor 视图引擎】基础操作 --页面跳转,传值,表单提交

时间:2021-12-12 16:35:18

ASPX  与  Razor  仅仅是视图不一样。

新建项目----ASP.NET MVC 4 Web 应用程序------选择模板(空)、视图引擎(Razor )

1、视图中 c# 代码  与 HTML 的转换

 @ using 命名空间             引用命名空间形式

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

 @{

一堆  c# 代码  ,能自动识别c# 与HTML

 }

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

  @(一句c# 代码)

      --有时 直接 一个 @ 不用括号也可

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

   @:       将冒号后面转换成文本或HTML

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

2、页面跳转

<a href =" / Home/ Idsert ">   </a>

           --以 “/” 开头表示从根目录下找

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

 @Html.ActionLink("添加hehe", "Insert", "Home")

                             (“显示的文本”,“动作名”,“控制器名”)

 @Html.ActionLink("修改", "Update/" + u.Ids, "Home") 

                                --  传值跳转   传u.Ids   

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

 <input type="button" value="添加新用户" id="btn1" />

<script type="text/javascript">
      document.getElementById("btn1").onclick = function () {

 window.location.href = " @Url.Action("Insert", "Home") ";

}

</script>

                                  -- 普通按钮提交跳转

                                  -- href 后面跟字符串

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

 

3、传值

只能由控制器的动作传到本动作的视图 

ViewBag 传值

ViewBag.变量=值

:     ViewBag.a= u ;   

:     <% Users u = ViewBag.a %>       

ViewData 传值

          传:    ViewData [ " a "] = u ;

          收:  Users uu =   ViewData [ " a "]  as Users

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

   全局变量传值   ,能夸控制器传值 

Session 传值

           传: session [ " a " ]= s ;

           收: string  s = session[ " a " ].Tostring( )

Cookies 传值

           传: Response.Cookies["aa"].Value = s;

           收:string ss = Request.Cookies["aa"].Value;

TempData 传值

           传:  TempData["a"] =" 用户名密码错误" ;

           收: string s = TempData["a"] ;

         -- 使用一次自动清空

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

强类型

    return View(u);

        -- 直接由视图传递值,

       --  一个视图页面中只能有一个强类型数据对象;

  传:

public ActionResult Update(string id)
       {
             Users u = new UsersData().SelectUser(id);

if (u != null)
            {
                   return View(u);  
             }
            else
             {
                  return RedirectToAction("index", "Home");
              }
         }

 收:

           @model Users      

                     -- 声明传进来的强类型的数据类型

                      -- 放在上方,model  都小写,后面没有分号;

          @Model.NickName   

                     -- 取值时      Model   M用大写

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

4、表单

(1)普通按钮,非标单按钮提交

    <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> <script type="text/javascript"> document.getElementById("div1").onclick = function () {
this.parentNode.submit();
//点击div时 提交 }
document.getElementById("btn1").onclick = function () {
this.form.submit(); } //普通按钮提交 </script>

(2)多表单提交

 @{using (Html.BeginForm("JiaFa", "Home", "post"))
{
string s=""; <input type="text" name="t1" />
<input type="text" name="t2" /> if(TempData["jg"]!= null )
{
s=TempData["jg"].ToString();
} <input type="text" name="t3" value ="@s" /> <input type="submit" value="加法" />
<input type="submit" id="btn2" value="减法" /> }
}
--------------------------------表单部分 <script type ="text/javascript" >
document.getElementById("btn2").onclick = function () { this.form.action = "@Url.Action("JianFa","Home") "; }; </script>
--------------------------------js 部分 public ActionResult JiaFa(string t1, string t2)
{
TempData["jg"] = Convert.ToInt32(t1) + Convert.ToInt32(t2);
return RedirectToAction("Test1", "Home");
} public ActionResult JianFa(string t1, string t2)
{
TempData["jg"] = Convert.ToInt32(t1) - Convert.ToInt32(t2);
return RedirectToAction("Test1", "Home");
}
------------------------------------------控制器部分

--此例中,表单默认提交到 JiaFa  动作中

点击 “减法” 按钮时,通过 js 改变表单提交的动作