New for ASP.NET Web Pages: Conditional attributes
from:http://www.mikepope.com/blog/AddComment.aspx?blogid=2353
March 01, 2012
The beta release of ASP.NET Web Pages has been released (for example, as part of the ASP.NET MVC 4 Beta release). There are only a few differences from the December 2011 Developer Preview release. (Details when we've got them posted.)
A very cool feature is what's being called conditional attributes. The idea is that in markup, you can set the value of an element's attribute to a variable or expression. If the variable or expression returns false or null, the entire attribute is not rendered. There are a variety of uses for this, but it does a great job of solving a problem we inherited from HTML 1.0 (I think it was).
The problem manifests in cases where the simple appearance of an attribute name — regardless of its value — is sufficient to trigger HTML behavior. One case is the checkbox, i.e., the<input type="checkbox"> element:
<input type="checkbox" name="check1" value="check1" checked />
<input type="checkbox" name="check1" value="check1" checked="true" />
<input type="checkbox" name="check1" value="check1" checked="anyThingAtAll" />
Notice that in the first one, the checked attribute doesn't even have a value. Nonetheless, all of these work the same, namely they produce checkbox that's selected.
There's a similar situation with items in a selection list:
<select>
<option value="A">A</option>
<option value="B" selected>B</option>
<option value="C">C</option>
</select>
Technically, to select item B, the tag should read <option value="B" selected="selected">, but just including the selected attribute works.
All of this presents a problem when you want to use code in ASP.NET Web Pages to check a checkbox or select a list item. To just set a normal attribute value, you can use inline Razor code like this:
<input type="text" name="text1" value="@Request.Form["text1"]" />
But that doesn't work for the checked or selected attributes, since it doesn't matter what you set those attributes to.
The solution up to now has been to use more elaborate code in the page to render (or not render) the entire attribute, not just its value. Here's one example:
<input type="checkbox" name="check1" value="check1"
@if(Request.QueryString["val1"] == "true"){
<text>checked="checked"</text>
}
/>
Or if you were inclined, you could use the C# ternary operator, like this:
<input type="checkbox" name="check1" value="check1"
@(Request.QueryString["val1"] == "true" ? Html.Raw("checked=\"checked\"") : null)
/>
Anyway, both of these methods were a little clunky.
It's now way simpler. As I say, you can now set an attribute to a code value, and if the value is true or non-null, the attribute renders. If it's false or null, the attribute doesn't render. Here's an example:
@{
bool check1 = false;
if(Request.QueryString["val1"] == "true"){
check1=true;
}
}
Then in the markup:
<input type="checkbox" name="check1" value="check1" checked="@check1" />
Magic.
You have to be careful that you don't assume that this works for all "truthy" and "falsy" values. For example, an empty string is not a false, so you can't return "" in order to kill the attribute. You could do something like this:
<input type="checkbox" name="check1" value="check1"
checked=@(!(Request.QueryString["val1"].IsEmpty())) />
but this will render the attribute no matter what actual value ("true", "false", "foo") happens to be in the query string for val1.
Here's a page where you can see in a little more detail how this works. Pass query-string values like ?val1=true or ?val2=true to see what happens.
@{
bool checked1=false;
bool checked2=false;
Object someObject = null;
string aString = String.Empty;
if(Request.QueryString["val1"] == "true"){
checked1=true;
}
if(Request.QueryString["val2"] == "true"){
checked2=true;
someObject = this;
aString="Hello, conditional attributes!";
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Test Conditional Attributes</title>
</head>
<body>
<form method="post">
<div>
<input type="checkbox" name="check1" value="check1" checked="@checked1" />
Value 1
<br/>
<input type="checkbox" name="check2" value="check2" checked="@checked2" />
Value 2
<br/>
<input type="checkbox" name="check3" value="check3" checked="@someObject" />
Some object
<br/>
<input type="checkbox" name="check4" value="check4" checked="@Request.Form["name"]" />
Request.Form["name"]
<br/>
<input type="checkbox" name="check5" value="check5" checked="@aString" />
aString
</div>
<div>
<input type="submit" name="buttonSubmit" value="Submit" />
</div>
</form>
</body>
</html>
New for ASP.NET Web Pages: Conditional attributes的更多相关文章
- Announcing the Release of ASP.NET MVC 5.1, ASP.NET Web API 2.1 and ASP.NET Web Pages 3.1 for VS2012
The NuGet packages for ASP.NET MVC 5.1, ASP.NET Web API 2.1 and ASP.NET Web Pages 3.1 are now live o ...
- ASP.NET Web Pages (Razor) API Quick Reference
ASP.NET Web Pages (Razor) API Quick Reference By Tom FitzMacken|February 10, 2014 Print This page co ...
- 如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites]
如何在ASP.NET Web站点中统一页面布局[Creating a Consistent Layout in ASP.NET Web Pages(Razor) Sites] 一.布局页面介绍[Abo ...
- Displaying Data in a Chart with ASP.NET Web Pages (Razor)
This article explains how to use a chart to display data in an ASP.NET Web Pages (Razor) website by ...
- 五张图概括 什么是 ASP 、 ASP.NET (Web Pages，Web Forms ，MVC )
当你看懂下面这五张图,我相信你对于学习.NET Web开发路线将不陌生! 来源: http://www.w3 ...
- ASP.NET Web Pages 的冲突版本问题
随着VS版本和.NET MVC版本.EF的版本的不断更新,虽然很多功能随着版本的提升而更完善,但对于旧版本开发的软件就有点悲催了,或许很多开发者都遇到类似的问题! 最近有一个项目是用.NET MVC3 ...
- ASP.NET Web Pages：C# 和 VB 实例
ylbtech-.Net-ASP.NET Web Pages:C# 和 VB 实例 1.返回顶部 1. ASP.NET Web Pages - C# 和 VB 实例 通过 C# 和 Visual Ba ...
- ASP.NET Web Pages：发布网站
ylbtech-.Net-ASP.NET Web Pages:发布网站 1.返回顶部 1. ASP.NET Web Pages - 发布网站 学习如何在不使用 WebMatrix 的情况下发布 Web ...
- ASP.NET Web Pages：PHP
ylbtech-.Net-ASP.NET Web Pages:PHP 1.返回顶部 1. ASP.NET Web Pages - PHP PHP 开发人员请注意,Web Pages 可以用 PHP 编 ...
随机推荐
- 半导体巨头青睐物联网领域 众强联手打造MCU生态系统
随着万物互联的时代到来,众多半导体巨头纷纷转战物联网领域.早在十年前,意法半导体曾将STM32推向市场,意法半导体对32位MCU在物联网方面的应用在两年前就已展开攻势. 4月25日,历经两届盛况的ST ...
- php调试时echo,print_r(),var_dump()的区别
简单说: var_dump() 能打印出类型 print_r() 只能打出值echo() 是正常输出... 需要精确调试的时候用 var_dump();一般查看的时候用 print_r() 另外 , ...
- sqldeveloper和plsqldebeloper
sqldeveloper : 支持不用tns连,支持jdbc直接连的. plsqldebeloper : 必须使用tns连, 如果oracle安装在本机,本机已经有tns文件,和oci.dll,只需在 ...
- 分布式缓存系统 Memcached 状态机之socket连接与派发
上节已经分析到了主线程中监听socket注册事件和工作线程中连接socket注册事件的回调函数都是event_handler,且event_handler的核心部分都是一个有限状态机:drive_ma ...
- Java-Maven-Runoob：Maven 自动化部署
ylbtech-Java-Maven-Runoob:Maven 自动化部署 1.返回顶部 1. Maven 自动化部署 项目开发过程中,部署的过程包含需如下步骤: 将所的项目代码提交到 SVN 或者代 ...
- ajax-简介和实现注册登录
ajax知识点介绍: 异步Javascript和XML,用Javascript语言与服务器进行异步交互,传输的数据为XML(当然,传输的数据不只是XML),也有可能是json 优点: 1. AJAX使 ...
- ubuntu 14.04使用root登陆出现错误“Error found when loading /root/.profile”解决
在刚修改完root权限自动登录后,发现开机出现以下提示: Error found when loading /root/.profile stdin:is not a tty ----........ ...
- Py修行路 python基础 （四）运算 copy
字符串的格式化 在字符串中插入 %s ,作为占位符,后边儿再定义插入变量. 算术运算 % 取模 判断奇偶数 / 除法 有小于号 // 取整除 返回整数部分 逻辑运算 and or not ' ...
- Bash读取/etc/passwd的特殊技巧
在twitter上看到的,记录一下: 可以bypass基于正则的规则,这里还可以引申出其他的bypass方法,
- Python函数的初识
一 什么是函数 定义: 定义一个事情或者功能,等到需要用的时候直接用就可以了,那么这个定义的就是一个函数 函数 : 对代码块和功能的封装和定义 函数定义的格式: def 函数名() ...