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的更多相关文章

  1. 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 ...

  2. 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 ...

  3. 如何在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 ...

  4. 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 ...

  5. 五张图概括 什么是 ASP 、 ASP.NET (Web Pages，Web Forms ，MVC )

    当你看懂下面这五张图,我相信你对于学习.NET Web开发路线将不陌生!                                               来源: http://www.w3 ...

  6. ASP.NET Web Pages 的冲突版本问题

    随着VS版本和.NET MVC版本.EF的版本的不断更新,虽然很多功能随着版本的提升而更完善,但对于旧版本开发的软件就有点悲催了,或许很多开发者都遇到类似的问题! 最近有一个项目是用.NET MVC3 ...

  7. 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 ...

  8. ASP.NET Web Pages：发布网站

    ylbtech-.Net-ASP.NET Web Pages:发布网站 1.返回顶部 1. ASP.NET Web Pages - 发布网站 学习如何在不使用 WebMatrix 的情况下发布 Web ...

  9. ASP.NET Web Pages：PHP

    ylbtech-.Net-ASP.NET Web Pages:PHP 1.返回顶部 1. ASP.NET Web Pages - PHP PHP 开发人员请注意,Web Pages 可以用 PHP 编 ...

随机推荐

  1. python中的单元测试pyUnit

    python中的单元测试pyUnit   在Python中进行单元测试时需要用到PyUnit模块,Python 2.1及其以后的版本都将PyUnit作为一个标准模块,但如果你使用的是较老版本的Pyth ...

  2. Linux 服务器的那些性能参数指标

    一个基于 Linux 操作系统的服务器运行的同时,也会表征出各种各样参数信息.通常来说运维人员.系统管理员会对这些数据会极为敏感,但是这些参数对于开发者来说也十分重要,尤其当你的程序非正常工作的时候, ...

  3. FastAdmin 增删改查在哪里？

    FastAdmin 增删改查在哪里? 一键生成 CRUD think crud -t test -u 1 执行命令合会在 controller 下生成 Test.php 控制器. 但是这个文件里确看不 ...

  4. bzoj 1004 [HNOI2008]Cards && poj 2409 Let it Bead ——置换群

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=1004 http://poj.org/problem?id=2409 学习材料:https:/ ...

  5. leetcode 21.Merge Two Sorted Lists ,java

    题目: Merge two sorted linked lists and return it as a new list. The new list should be made by splici ...

  6. JGroups 入门实践

    前言 JGroups是一个开源的纯java编写的可靠的群组通讯工具.其工作模式基于IP多播,但可以在可靠性和群组成员管理上进行扩展.其结构上设计灵活,提供了一种灵活兼容多种协议的协议栈. JGroup ...

  7. Fragment和FragmentActivity的使用

    可以分为下面的几部分: 使用支持库 创建一个Fragment 创建一个动态UI 多个Fragment之间的通信 1.使用支持库 如果您的应用需要运行在3.0及以上的版本,可以忽略这部分内容. 如果您的 ...

  8. HPPTS SSL

    https加密.解密.及验证过程如下图: HTTPS怎么实现安全传输的? 建立安全传输 HTTPS中, 客户端首先打开一条到WEB服务器443端口的连接. 一旦建立了TCP连接 ,客户端和服务器就会初 ...

  9. Ajax验证用户名

    用Ajax验证用户名: 接口: get guestbook/index.php m : index a : verifyUserName username : 要验证的用户名 返回 { code : ...

  10. SpringCloud子项目

    Spring Cloud简介 Spring Cloud是一个基于Spring Boot实现的云应用开发工具,它为基于JVM的云应用开发中涉及的配置管理.服务发现.断路器.智能路由.微代理.控制总线.全 ...