表单中的readOnly 和disabled
readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容。但是它们之间有着微小的差别,总结如下:
disabled也可以禁用按钮和链接:
<button type="button" class="btn btn-primary btn-lg" disabled="disabled">
禁用的原始按钮
</button>
<a href="#" class="btn btn-primary btn-lg disabled" role="button">
禁用的原始链接
</a>
Readonly只针对input(text / password)和textarea有效,而disabled对于所有的表单元素都有效,包括select, radio, checkbox, button等。
但是表单元素在使用了disabled后,当我们将表单以POST或GET的方式提交的话,这个元素的值不会被传递出去,而readonly会将该值传递出去(这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly,但是submit button却是可以使用的)。
在asp.net mvc 的视图中要显示某个表单值而不更改其值,并且处理表单的操作方法中要调用这个值,在视图中有三种方法处理:
1、将该值作为隐藏字段处理,而在显示中用displayFor HTML辅助方法,字段值就作为一个文本处理,当然表单提交也不会提交该字段。
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model =>model.UserName)
<div class="form-group">
@Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<p class="form-control-static">
@Html.DisplayFor(model => model.UserName, new { htmlAttributes = new { @class = "form-control" } })
</p>
</div>
</div>
2、将该值作为隐藏字段处理,在Editor Html辅助方法中添加disabled="disabled" html属性值,这样就显示一个灰色的文本框。因为表单已经被disabled掉,所以表单不会提交该字段值到控制器的操作方法中。
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model =>model.UserName)
<div class="form-group">
@Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<p class="form-control-static">
@Html.Editfor(model => model.UserName, new { htmlAttributes = new { @class = "form-control",disabled="disabled" } })
</p>
</div>
</div>
3、使用 readonly属性,也会显示一个灰色的文本框。由于readonly 是C#的关键字。所有只能使用原始的HTML标记。这种情况表单字段值会提交到控制器的操作方法,要注意手动设置表单字段的Name 属性和value属性。
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
<input type="text" value="@Model.UserName" class="form-control" readonly="readonly" name="UserName" />
</div>
</div>
相关的action值:
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult ChangeUserPassword(ResetPasswordViewModel _resetPasswordViewModel)
{
if (!ModelState.IsValid)
{
return View(_resetPasswordViewModel);
}
var _user = UserManager.FindByName(_resetPasswordViewModel.UserName);
if (_user == null)
return new HttpStatusCodeResult(HttpStatusCode.BadRequest);
var code =UserManager.GeneratePasswordResetToken(_user.Id);
var result =UserManager.ResetPassword(_user.Id,code,_resetPasswordViewModel.Password);
if (result.Succeeded)
{
return RedirectToAction("Index");
}
return View();
}
表单中的readOnly 和disabled的更多相关文章
- angular4 form 表单中 input输入框的disabled属性
直接加[disabled]="isDisabled"属性的话,出现报错 根据提示,做如下修改 private isEdit: boolean = true; private isD ...
- angular2+ form 表单中 input输入框的disabled属性设置无效
最近项目中遇到一个表单input设置disabled问题,直接赋值angular原生的[disabled]=“isDisabled”无效,浏览器警告信息: 无奈,只能按照控制台提示修改: 问题解决
- 表单中Readonly和Disabled的区别(转载)
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / pass ...
- 转:表单中Readonly和Disabled的区别(HTML中使用javascript解除禁止input输入框代)
转:表单中Readonly和Disabled的区别 参考资料: disabled和readonly区别: 参考博文1地址:http://blog.csdn.net/symgdwyh/article/d ...
- 表单中Readonly和Disabled的区别(转)
今天做form提交的时候,用到了disabled,form提交的时候怎么获取都是null,后来用hidden解决了这个问题,但是考虑到为什么,最后找到了原因,转载一篇文章,说明一下 原文:http:/ ...
- 表单中Readonly和Disabled的区别:readonly在get和post可传值到后端,disabled不可
http://www.nowamagic.net/html/html_ReadonlyAndDisabled.php Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能 ...
- 【转载】表单中 Readonly 和 Disabled 的区别
今天写代码,遇到表单提交的问题,某个字段在不同的情况下,要传递不同的值进行赋值,试过一些方法都有些问题,后来请教前端同学,使用 disabled 这个属性终于搞定了问题,查到一篇讲解 readonly ...
- 关于表单中Readonly和Disabled
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / pass ...
- 表单中Readonly和Disabled的区别
1.readonly是要锁定这个控件,通过在界面上无法修改他(但是通过javascript可以修改他). 2.disabled和readonly有相同的地方也是可以锁定这个控件用户不能改变他的值,但是 ...
随机推荐
- MITM Proxy环境搭建
MITM_Proxy环境搭建 环境要求 系统环境要求: Ubuntu 14.04 x64,CentOS 7 x64以上版本系统(建议使用xubuntu 14.04 x64,稳定硬件要求低) Pytho ...
- 2018 ACM 国际大学生程序设计竞赛上海大都会赛重现赛 A,D
A链接:https://www.nowcoder.com/acm/contest/163/A Fruit Ninja is a juicy action game enjoyed by million ...
- hdu - 5074 Hatsune Miku (简单dp)
有m种不同的句子要组成一首n个句子的歌,每首歌都有一个美丽值,美丽值是由相邻的句子种类决定的,给出m*m的矩阵map[i][j]表示第i种句子和第j种句子的最大得分,一首歌的美丽值是由sum(map[ ...
- eclipse 修改Java代码 不用重新启动tomcat
例子: 1.在tomcat server.xml文件配置加上这句话: <Context debug="0" docBase="C:\Users\admin\Desk ...
- spring mvc get请求也可以接受DTO对象
spring mvc get请求也可以接受DTO对象,比如:url上面你还是将参数&符号连接起来,并自动封装进一个DTO对象里. 只有@RequestBody注解spring mvc才会从ht ...
- 前端3D、动画相关开源JS
WebGL http://taobaofed.org/blog/2015/12/21/webgl-handbook/ D3 (或者叫 D3.js )是一个基于 web 标准的 JavaScript 可 ...
- 如何在Win7 x64上的配置32位的PostgreSQL ODBC数据源
在Win7 x64下安装最新版的PostgreSQL 9.x 后,从其官网下载最新的 ODBC驱动,分为普通的32位和64位版本,正常安装后,从已安装软件列表里可以看到两个版本的驱动都已经正确显示出来 ...
- Delphi中匿名方法动态绑定事件
应恢弘之约,写了一个对其发布的匿名函数动态绑定到事件的封装,代码如下: type TAnonEvent=class public class function Wrap<T1,T2>(On ...
- 基于51单片机的CAN通讯协议C语言程序
//-----------------------函数声明,变量定义-------------------------------------------------------- #includ ...
- Working with Validators and Messages in AngularJS
原文:http://odetocode.com/blogs/scott/archive/2014/10/16/working-with-validators-and-messages-in-angul ...