• MVC学习之数据绑定:表单数据绑定


    在MVC中。如果想在代码中获得提交的表单中的数据。有两种方法:

    1、使用FormCollection

    2、使用Model

    接下来我们就具体介绍下:

    首先先介绍使用FormCollection来取得整个表单的信息

    前端页面:

    @{
        ViewBag.Title = "GetFormInfo";
    }
    <h2>GetFormInfo</h2>
    @using (Html.BeginForm()){
        <strong>用户姓名:</strong><input id="username" name="username" type="text" /><br />
        <strong>用户密码:</strong><input id="userpass" name="userpass" type="text" /><br />
        <strong>用户邮箱:</strong><input id="useremail" name="useremail" type="text" /><br />
        <input type="submit" value="提交" name="submit" />
    }

     或者:

    @{
        ViewBag.Title = "GetFormInfo";
    }
    <h2>GetFormInfo</h2>
    <form method="post">
        <strong>用户姓名:</strong><input id="username" name="username" type="text" /><br />
        <strong>用户密码:</strong><input id="userpass" name="userpass" type="text" /><br />
        <strong>用户邮箱:</strong><input id="useremail" name="useremail" type="text" /><br />
        <input type="submit" value="提交" name="submit" />
    </form>

    后台代码:

     #region 获得表单中的数据 FormCollection
            /// <summary>
            /// 这个方法是显示页面的方法
            /// </summary>
            /// <param name="info"></param>
            /// <returns></returns>
            public ActionResult GetFormInfo()
            {
                return View();
            }
    
            /// <summary>
            /// 这个方法是提交表单时执行的方法
            /// </summary>
            /// <param name="info"></param>
            /// <returns></returns>
            [HttpPost]
            public ActionResult GetFormInfo(FormCollection info)    //获得整个表单里面的值
            {
                string name = info["username"];
                string pass = info["userpass"];
                string email = info["useremail"];
                return RedirectToAction("GetFormInfo");
            } 
            #endregion

    执行效果:

    接着我们使用model来获取表单的数据

    前端代码:

    @model CodeFirst.Models.flowers
    @{
        ViewBag.Title = "GetData";
    }
    <h2>GetData</h2>
    @using (Html.BeginForm())
    {
        <ul>
            <li>
                @Html.LabelFor(model => model.Id)
                @Html.EditorFor(model => model.Id)
            </li>
            <li>
                @Html.LabelFor(model => model.Name)
                @Html.EditorFor(model => model.Name)
            </li>
            <li>
                @Html.LabelFor(model=>model.Price)
                @Html.EditorFor(model=>model.Price)
            </li>
        </ul>
        <input type="submit" value="提交"/>
    }

    后台代码:

    #region 获得表单中的数据 利用model
            public ActionResult GetData()
            {
                return View();
            }
    
            [HttpPost]
            public ActionResult GetData(flowers flower)
            {
                int id = flower.Id;
                string name = flower.Name;
                string price = flower.Price;
                return View();
            } 
            #endregion

    Model文件中的类flowers的代码:

    using System;
    using System.Collections.Generic;
    using System.ComponentModel;
    using System.Linq;
    using System.Web;
    
    namespace CodeFirst.Models
    {
        public class flowers
        {
            [DisplayName("ID号")]
            public int Id { get; set; }
            [DisplayName("名字")]
            public string Name { get; set; }
            [DisplayName("价格")]
            public string Price { get; set; }
    
        }
    }

    执行效果:

    注意事项:

    前端页面代码:

    实时页面代码:

     写写博客,方便自己也方便有需要的人!

  • 相关阅读:
    EdgeX Foundry初体验(五)-- Web Console图形界面(v1.0.0)
    第十九节:SQLServer通过发布订阅实现主从同步(读写分离)详解
    第六节:Ocelot之自身负载、网关限流、缓存和熔断机制
    第十九节:SQLServer通过发布订阅实现主从同步(读写分离)详解
    第十七节:分区、分表、分库以及基于EFCore实现读写分离
    第六节:IdentityServer4设备流授权模式和扫码登录(应用于IOT)
    第五节:IdentityServer4的Pkce机制、令牌刷新机制、混合授权模式
    第十一节:IdentityServer4授权码模式介绍和代码实操演练
    第十二节:Ocelot集成IDS4认证授权-微服务主体架构完成
    第十节:IdentityServer4隐式模式介绍和代码实操演练
  • 原文地址:https://www.cnblogs.com/Yisijun/p/4682263.html
Copyright © 2020-2023  润新知