Total Pageviews

12/28/2009

Control's ClientID in Asp.net 4.0

ASP.NET 4 allows developers to customize Client Id which gets generated by ASP.NET. Up until now Client Id generated by ASP.NET has been ummm just plain ugly. Other than aesthetics they are also hard to work with in client side scripts. ASP.NET solves this issue to a degree by providing ClientIDMode property. In this post we will look at different ways to work with this new feature of ASP.NET 4.
ClientIDMode can be set at Page level or at Control level. Let’s follow with an example of a GridView control. We will set it’s ClientIdMode property to all available options and view the markup. We will bind our GridView to a collection of cities. A city class looks like this.
public class City
{
  public string Name { get; set; }
  public string Country { get; set; }
}

The collection itself can be initialized using this code.
List<City> cities =
   new List<City>
    {
     new City{ Name = "Sydney", Country = "Australia" },
     new City{ Name = "New York", Country = "USA" },
     new City{ Name = "Paris", Country = "France" },
     new City{ Name = "Milan", Country = "Spain" },
     new City{ Name = "Melbourne", Country = "Australia" },
     new City{ Name = "Auckland", Country = "New Zealand" },
     new City{ Name = "Tokyo", Country = "Japan" },
     new City{ Name = "New Delhi", Country = "India" },
     new City{ Name = "Hobart", Country = "Australia" }
   };


Source for our GridView looks like this.
<asp:GridView runat="server" ID="gridViewCities" AutoGenerateColumns="False">
  <Columns>
    <asp:TemplateField>
      <ItemTemplate>
        <asp:Label runat="server" ID="Label1" Text='' />
      ItemTemplate>
    asp:TemplateField>
    <asp:TemplateField>
      <ItemTemplate>
        <asp:Label runat="server" ID="Label2" Text='' />
      ItemTemplate>
    asp:TemplateField>
  Columns>
asp:GridView>


ClientIDMode = “AutoID”

Using this mode will generate the IDs as it has in earlier versions of ASP.NET.
<asp:GridView
        runat="server"
        ID="gridViewCities"
        AutoGenerateColumns="False"
        ClientIDMode="AutoID">

HTML generated by AutoID (showing only relevant part).
image

ClientIDMode = “Static”

Static mode outputs the same ID in HTML as specified in ASP.NET source.
<asp:GridView
        runat="server"
        ID="gridViewCities"
        AutoGenerateColumns="False"
        ClientIDMode="Static">

image
Static Mode is not the best for controls such as GridView or any other data control which displays lists of data. As you can see above that all span tags have same IDs. Static Mode is best to be used with other common controls or User Controls.

ClientIDMode = “Predictable”

Predictable mode concatenates the ID of parent control with the bound value supplied by assigning ClientIDRowSuffix property.
<asp:GridView
        runat="server"
        ID="gridViewCities"
        AutoGenerateColumns="False"
        ClientIDMode="Predictable"
        ClientIDRowSuffix="Name">


image
Here we see that our span elements have been named by concatenating the name of GridView + value of Name property. Rather than setting ClientIDRowSuffix to Name property a better candidate would have been an ID property which could be some sort of unique field. But you get the idea, right?

ClientIDMode = “Inherit”

Inherit is the default mode for all controls. Assigning this mode a control will use the same setting as its parent control. This gives us an idea that we can have different settings for parent and children. Here we are setting ClientIDMode for our first label to be static while the GridView is using AutoID.
<asp:GridView runat="server" ID="gridViewCities" AutoGenerateColumns="False" 
  ClientIDMode="AutoID">
  <Columns>
    <asp:TemplateField>
      <ItemTemplate>
        <asp:Label runat="server" ID="Label1" Text='' 
          ClientIDMode="Static" />
      ItemTemplate>
    asp:TemplateField>
    <asp:TemplateField>
      <ItemTemplate>
        <asp:Label runat="server" ID="Label2" Text='' />
      ItemTemplate>
    asp:TemplateField>
  Columns>
asp:GridView>

image
We see that our first span uses static client ID but the second span uses inherited scheme for client ID.

Use Internet Information Services (IIS) to secure Microsoft .NET Remoting functionality.

Microsoft .NET Remoting allows applications running in different application domains or processes to communicate. By default, remote components communicate either over transmission control protocol (TCP) or Hypertext Transfer Protocol (HTTP). One of the problems with cross-process communication is authentication. To take advantage of Windows authentication, you should use HTTP for remote communication. This allows you to host the remote component in IIS, which supports Windows authentication. If you use TCP for remote communication, you would need to implement a custom authentication mechanism.

Which is better: Control or WebControl?

The System.Web.UI.Control class is the base class for all server controls. This provides the properties, methods, and events shared by all web controls. The System.Web.UI.WebControls.WebControl class derives from the Control class and adds style properties such as Font, Forecolor, and Backcolor.

Microsoft recommends:
1. if your custom control contains no user interface elements then derive from Control Class.
2. if your custom control provides a user interface, then derive from WebControl class.

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Affiliate Network Reviews