Form表单的传递与接收

Posted 2021-12-12 yunquan

目录

• 表单的构建
• 后端接收
• 创建model
• 用Model接收表单的后端

表单的构建

我才知道这个东西，在开发中经常遇到表单的情况。一下子提交一串内容。表单元素 form，里面的内容必须有name字段。form表单action就是你后端控制器的地址，涉及密码一般post，enctype以流的形式。只要里面的元素有name，后端就可以通过name获取到。type="submit" 这就是提交表单了

<form action="/Home/test" method="post" enctype="multipart/form-data">
        账号：<input type="text" name="userName" value="默认值" required><br />   
        密码：<input type="password" name="passWord"><br />
        性别：<input type="radio" name="sex" value="boy" checked="checked" />男
        <input type="radio" name="sex" value="girl" />女
        <input type="radio" name="sex" value="none" />保密<br />
        爱好：
        <input type="checkbox" name="hobby" value="Vae" checked="checked">许嵩
        <input type="checkbox" name="hobby" value="JJ" checked="checked">林俊杰
        <input type="checkbox" name="hobby" value="shuyunquan">蜀云泉<br />

        城市：
        <select name="city" multiple="multiple" size="2">
            <!--multiple是可以多选的意思，size是一次显示几个，option加value就是值是什么，不加默认写的深圳-->
            <option value="sz">深圳</option>
            <option value="bj">北京</option>
            <option value="hn">河南</option>
        </select><br /><br />

        简介：
        <textarea name="intro" rows="5" cols="30"></textarea>  <!--这里textarea不能换行，必须写两个而且在同一行-->
        <br /><br />

        <input type="submit" value="注册" />
        <input type="reset" value="重置" />
    </form>

后端接收

想接受一个就这样写，里面是name。但是表单元素这么多，一个一个的接收，这不费事吗

        [HttpPost]
        public ActionResult test(FormCollection collection)
        {
            string name=collection["userName"];  
            return View();
        }

创建model

一般来说，数据库的表对应一个model，然后表单的内容，也差不多就是model的字段。都是对应的，我们对上面的表单创建一个对应字段的model

public class Info
    {
        public string userName { get; set; }
        public string passWord { get; set; }
        public string sex { get; set; }
        public string hobby { get; set; }
        public string city { get; set; }
        public string intro { get; set; }

    }

用Model接收表单的后端

        [HttpPost]
        public ActionResult test(FormCollection collection)
        {
            Info info = new Info();
            TryUpdateModel(info);
            return View();
        }

没了，就一个TryUpdateModel方法就可以自动的把表单内容映射进model，然后接下来你是存进数据库还是操作就随意了。