MVC學習系列9--控制器接收從視圖傳遞過來的參數

時間 2019-11-30

標籤 mvc 學習系列控制器接收視圖傳遞過來參數简体版

原文原文鏈接

前面學習了，從控制器向視圖傳遞數據，如今學習怎麼從視圖向控制器傳遞數據。css

一般，咱們有兩種方式，來處理瀏覽器的請求，一個是GET方式，一個是POST方式。通常來講，直接經過在瀏覽器中輸入URL話，請求的方式是GET，那麼GET方式的Action方法將會被調用，另外一方面，若是是點擊一個Button提交一個表單的話，這個時候POST方式的Action就會被調用。html

這裏咱們說的是POST方式，怎麼從視圖向控制器傳遞數據，即把用戶輸入的表單信息的數據，傳遞到控制器對應的Action方法中。瀏覽器

這裏先列舉一下,從視圖向控制器傳遞數據有4種方法：學習

使用傳統的方法【Request】
使用FormCollection方式
自定義參數的方式
模型綁定

先看看，傳統的方式：ui

1.首先新建一個空白的MVC項目：，新建一個控制器Homespa

  public ActionResult Index()
        {

            return View();
        }

        #region 1.傳統的方式：經過Qequest方式獲取從視圖傳遞過來的數據
        [HttpPost]
        public ActionResult PostIndex()
        {
            //1.傳統的方式：經過Qequest方式獲取從視圖傳遞過來的數據
            //這裏的Request["Name"]中的Name是文本框中的name屬性值，
            //不能在視圖中去掉，不然報錯：未將對象引用設置到對象的實例
            //Request不能經過索引來取值，即Request[0]
            string name = Request["Name"].ToString();
            string sex = Request["Sex"].ToString();
            int age = Convert.ToInt32(Request["Age"].ToString());
            string phone = Request["Phone"].ToString();
            StringBuilder sb = new StringBuilder();
            sb.Append("<b>Name:" + name + "</b><br/>");
            sb.Append("<b>Sex:" + sex + "</b><br/>");
            sb.Append("<b>Age:" + age + "</b><br/>");
            sb.Append("<b>Phone:" + phone + "</b><br/>");
            return Content(sb.ToString());
        } 
        #endregion

對應的Index視圖code

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <style type="text/css">

        #parentDIV {
        border:1px solid green;
        text-align:center;

        }
    </style>
</head>
<body>
    <div> 
        @using (Ajax.BeginForm("PostIndex", "Home", new AjaxOptions() { UpdateTargetId = "myDIV", HttpMethod = "POST" }))
        { 
        <div id="myDIV"></div>
    <div id="parentDIV">
        <div>
            @*label中的for裏面的值是相對應的文本框的ID值*@
            <label for="Name">姓名:</label>
            <input type="text" value="" placeholder="姓名" id="Name" name="Name" />
        </div>
        <div>
            <label for="Man">性別:</label>
            @*提交的是值value*@
            <input type="radio" name="Sex" id="Man" value="男" />男<input type="radio" name="Sex" id="Female" value="女" />女
        </div>
        <div>
            <label for="Age">年齡：</label>
            <input type="text" value="" placeholder="年齡" id="Age" name="Age" />
        </div>
        <div>
            <label for="Phone">電話：</label>
            <input type="text" value="" placeholder="電話" id="Phone" name="Phone" />
        </div>
        <div>
            <button>肯定</button>
        </div>
    </div>
        }
    </div>
</body>
</html>

運行一下項目：orm

輸入數據，點擊肯定：htm

這裏就是經過傳統方式，從視圖向控制器傳遞數據了。對象

在看看FormCollection方式：

  #region 2.經過FormCollection：和Request相似
        [HttpPost]
        public ActionResult PostIndex(FormCollection formCol)
        {
            //2.經過FormCollection：和Request相似
            ///不能在視圖中去掉，不然報錯：未將對象引用設置到對象的實例,
            //而且去掉以後，Name的值就獲取不到了，在參數裏面使用formCol[0]，獲取到的就是Sex控件的值
            //string name = formCol[0].ToString();
            string name = formCol["Name"].ToString();
            string sex = formCol["Sex"].ToString();
            int age = Convert.ToInt32(formCol["Age"].ToString());
            string phone = formCol["Phone"].ToString();
            StringBuilder sb = new StringBuilder();
            sb.Append("<b>Name:" + name + "</b><br/>");
            sb.Append("<b>Sex:" + sex + "</b><br/>");
            sb.Append("<b>Age:" + age + "</b><br/>");
            sb.Append("<b>Phone:" + phone + "</b><br/>");
            return Content(sb.ToString());
        } 
        #endregion

  public ActionResult Index()
        {

            return View();
        }

結果也是同樣的。

在看看自定義參數方式：

#region 3.經過使用自定義參數方式：
        [HttpPost]
        public ActionResult PostIndex(string name, string sex, string age, string phone)
        {
            //3.經過使用自定義參數方式：
            //這裏的參數的名字name，sex，age，phone,
            //必需要和視圖中的空間的name屬性值的名字同樣,但大小寫能夠無所謂；
            //由於通常用戶輸入的數據都是字符串類型的，因此咱們在使用參數的時候，都定義成string類型，在用的時候在轉化。
            //固然也能夠定義成其餘類型，好比這裏的age參數，我能夠定義成int? age,也是能夠的。
            //還有參數的順序無所謂；

            //string name = formCol[0].ToString();
            //string ame = _name;
            //string sex = formCol["Sex"].ToString();
            int _age = Convert.ToInt32(age);
            //string phone = formCol["Phone"].ToString();
            StringBuilder sb = new StringBuilder();
            sb.Append("<b>Name:" + name + "</b><br/>");
            sb.Append("<b>Sex:" + sex + "</b><br/>");
            sb.Append("<b>Age:" + _age + "</b><br/>");
            sb.Append("<b>Phone:" + phone + "</b><br/>");
            return Content(sb.ToString());
        }  
        #endregion

  public ActionResult Index()
        {

            return View();
        }

結果同樣。

最後看看模型綁定：

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

namespace DataFromVIewToController.Models
{
    public class Student
    {
        public string Name { get; set; }
        public string Sex { get; set; }
        public int Age { get; set; }
        public string Phone { get; set; }
    }
}

#region 4.模型綁定
        [HttpPost]
        public ActionResult PostIndex(Student model)
        {
            //4.經過使用模型綁定的方式：
            StringBuilder sb = new StringBuilder();
            sb.Append("<b>Name:" + model.Name + "</b><br/>");
            sb.Append("<b>Sex:" + model.Sex + "</b><br/>");
            sb.Append("<b>Age:" + model.Age + "</b><br/>");
            sb.Append("<b>Phone:" + model.Phone + "</b><br/>");
            return Content(sb.ToString());
        }   
        #endregion

  public ActionResult Index()
        {

            return View();
        }

@model DataFromVIewToController.Models.Student
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <style type="text/css">

        #parentDIV {
        border:1px solid green;
        text-align:center;

        }
    </style>
</head>
<body>
    <div> 
        @using (Ajax.BeginForm("PostIndex", "Home", new AjaxOptions() { UpdateTargetId = "myDIV", HttpMethod = "POST" }))
        { 
        <div id="myDIV"></div>
    <div id="parentDIV">
        <div>
            @*label中的for裏面的值是相對應的文本框的ID值*@
            <label for="Name">姓名:</label>
            @*<input type="text" value="" placeholder="姓名" id="Name" name="Name" />*@
          @Html.TextBoxFor(s=>s.Name)
        </div>
        <div>
            <label for="Man">性別:</label>
            @*提交的是值value*@
            @*<input type="radio" name="Sex" id="Man" value="男" />男<input type="radio" name="Sex" id="Female" value="女" />女*@
          @Html.RadioButtonFor(s=>s.Sex,"男") 男
            @Html.RadioButtonFor(s=>s.Sex,"女") 女
        </div>
        <div>
            <label for="Age">年齡：</label>
            @*<input type="text" value="" placeholder="年齡" id="Age" name="Age" />*@
           @Html.TextBoxFor(s => s.Age)
        </div>
        <div>
            <label for="Phone">電話：</label>
            @*<input type="text" value="" placeholder="電話" id="Phone" name="Phone" />*@
           @Html.TextBoxFor(s => s.Phone)
        </div>
        <div>
            <button>肯定</button>
        </div>
    </div>
        }
    </div>
</body>
</html>