MVC5使用单选按钮与下拉框【转】
某人认为下拉列表的呈现形式不如单选按钮漂亮,我只好去测试一下单选按钮与下拉框了。测试代码如下:
1.model类Blog.cs(类型使用枚举类型,自动生成的视图会以下拉列表形式显示):
using System.ComponentModel;
using System.ComponentModel.DataAnnotations; namespace WebTest.Models
{
public enum B_Type
{
原创,转载,翻译
}
public class Blog
{
[Key]
public int B_Id { get; set; } [DisplayName("标题")]
public string B_Title { get; set; } [DisplayName("内容")]
public string B_Content { get; set; } [DisplayName("类型")]
public B_Type B_Type { get; set; } [DisplayName("标签")]
public string B_Tag { get; set; }
}
}
2.在web.config添加连接数据库的字符串(推荐使用sql server数据库,或者使用vs自带的localdb。这一步不会就乖乖去看入门教程,懒得写步骤),然后快捷键ctrl+shift+B 生成解决方案,然后新建带视图的控制器。
3.修改自动生成的Create.cshtml视图代码如下(仔细看一下更改部分):
<div class="form-group">
@Html.LabelFor(model => model.B_Type, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EnumDropDownListFor(model => model.B_Type, htmlAttributes: new { @class = "form-control" })</span>
@Html.ValidationMessageFor(model => model.B_Type, "", new { @class = "text-danger" })
</div>
</div> <div class="form-group">
@Html.LabelFor(model => model.B_Tag, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@*@Html.EditorFor(model => model.B_Tag, new { htmlAttributes = new { @class = "form-control" } })*@
@Html.RadioButtonFor(model=>model.B_Tag, "c#",new { htmlAttributes = new { @class = "form-control" } })C#
@Html.RadioButtonFor(model => model.B_Tag, "java", new { htmlAttributes = new { @class = "form-control" } })Java
@Html.RadioButtonFor(model => model.B_Tag, "python", new { htmlAttributes = new { @class = "form-control" } })Python</span>
@Html.ValidationMessageFor(model => model.B_Tag, "", new { @class = "text-danger" })
</div>
</div>
4.在浏览器打开Create.cshtml视图,新建一条数据,系统在自动创建数据库时会往数据库添加你新建的数据内容
5.修改Edit.cshtml视图代码如下(注意观察不同,视图呈现时会自动选中数据库存储的内容的):
<div class="form-group">
@Html.LabelFor(model => model.B_Tag, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@*@Html.EditorFor(model => model.B_Tag, new { htmlAttributes = new { @class = "form-control" } })*@
@Html.RadioButtonFor(model => model.B_Tag, "c#", new { htmlAttributes = new { @class = "form-control" } })C#
@Html.RadioButtonFor(model => model.B_Tag, "java", new { htmlAttributes = new { @class = "form-control" } })Java</span>
@Html.RadioButtonFor(model => model.B_Tag, "python", new { htmlAttributes = new { @class = "form-control" } })Python
@Html.ValidationMessageFor(model => model.B_Tag, "", new { @class = "text-danger" })
</div>
</div>
6.如果你做了一遍,就会对流程比较清楚了,对应着改自己的项目即可。现在我还是分不清哪个漂亮,不过从实现上讲,下拉列表更易实现,只需将model类中的某一字段定义为枚举类型,就不必你改代码了呀。
MVC5使用单选按钮与下拉框【转】的更多相关文章
- spring mvc:常用标签库(文本框,密码框,文本域,复选框,单选按钮,下拉框隐藏于,上传文件等)
在jsp页面需要引入:<%@taglib uri="http://www.springframework.org/tags/form" prefix="form&q ...
- [ PyQt入门教程 ] PyQt5基本控件使用:单选按钮、复选框、下拉框
本文主要介绍PyQt5界面最基本使用的单选按钮.复选框.下拉框三种控件的使用方法进行介绍. 1.RadioButton单选按钮/CheckBox复选框.需要知道如何判断单选按钮是否被选中. 2.Com ...
- MVC5 下拉框绑定(单选)
1.Model [Display(Name = "学历")] public ICollection<System.Web.Mvc.SelectListItem> asd ...
- jquery实现下拉框多选
一.说明 本文是利用EasyUI实现下拉框多选功能,在ComboxTree其原有的基础上对样式进行了改进,样式表已上传demo,代码如下 二.代码 <!DOCTYPE html PUBLIC & ...
- 利用js取到下拉框中选择的值
现在的需求是:下拉框中要是选择加盟商让其继续选择学校,要是选择平台管理员则不需要选择学校.隐藏选择下拉列表. 选择枚举值: /// <summary> /// 平台角色 /// </ ...
- jquery禁用下拉框
禁用下拉框 //下拉框禁用 $("select").each(function () { $("#" + this.id).attr("disable ...
- [原创]自己动手实现React-Native下拉框控件
因项目需要,自己动手实现了一个下拉框组件,最近得空将控件独立出来开源上传到了Github和npm. Github地址(求Star 求Star 求Star
- ajax 多级联动 下拉框 Demo
写了ajax实现级联下拉框,考虑常用,并且级联个数随不同业务个数不同,于是就整理了一下,实现了 ajax + N级联动 下拉框的效果 效果图 HTML 代码 <h2> 省级联动</h ...
- jquery Combo Select 下拉框可选可输入插件
Combo Select 是一款友好的 jQuery 下拉框插件,在 PC 浏览器上它能模拟一个简单漂亮的下拉框,在 iPad 等移动设备上又能回退到原生样式.Combo Select 能够对选项进行 ...
随机推荐
- June 05th 2017 Week 23rd Monday
No great discovery was ever made without a bold guess. 没有大胆的猜测就没有伟大的发现. I've read this sentence just ...
- 第一次团队合作,对Scrum的初步了解
学习和运用scrum 作为长大的大三老腊肉,我们已经在长大生活了两年多,对于什么是长大人最想完善的校园需求.最想拥有的校园服务媒介也有了更加深切的体会. 于是,GoodJob小团队blingbling ...
- ABAP宏的调试
我们都知道高级语言宏一般是无法调试的.但是ABAP的宏例外. 比如我写了下面一段宏,名为insert_table. 执行这段代码,调试器会在第23行停下来. ABAP调试器里有个工具可以用于宏的调试, ...
- OC block声明和使用
#import "Button.h" typedef int (^MySum) (int, int); void test() { // 定义了一个block,这个block返回值 ...
- Codeforces Round #333 (Div. 1)
A. The Two Routes In Absurdistan, there are n towns (numbered 1 through n) and m bidirectional railw ...
- Ural State University Internal Contest October'2000 Junior Session
POJ 上的一套水题,哈哈~~~,最后一题很恶心,不想写了~~~ Rope Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 7 ...
- 教你用SingalR实现后台开发程序运行时时检测
在调试js的时候都喜欢用console.log输出相应的运行结果或者查看变量值,以便于调试程序bug,可是程序后台代码运行的时候,本地没有问题,线上代码有问题怎么办呢,写日志是一个办法,可是有没有更直 ...
- Windows7安装Envi4.8简体中文破解版
在正式安装前,建议先完整阅读本教程!本教程所使用的是Envi 4.8 32 位安装包,径测试,在64位windows7上可以正常安装使用!本教程就是在64位windows7上安装32位Envi4.8! ...
- 数据库——MySQL——多表查询
这里多表,为了方便我只建了两张表,更复杂的表间也就是这些东西,就是复杂程度不一样. 数据源准备 建立一个学生表,和一个班级表 # 建立学生表 create table student( id int ...
- H5面试题整理
1.新的HTML5文档类型和字符集是? 文档类型:<!doctype html> 使用UTF-8编码示例:<meta charset="UTF-8"> 2. ...