Client ID Mode in ASP.Net 4.0

Hi Friends,

Just for the sake of simplicity, i thought to blog about New Client Id Mode which is been incorporated in the ASP.Net 4.0 Version.  So, Basically Client ID Mode lets you control Client Id’s of the server controls. It basically comes with 4 different flavors. These are
1) AutoID:- This one is the same as on 3.5 version or earlier one
2) Static:- What you type, that is going to be used.
3) Predictable:- Basically, concatenates the naming containers which one can set with new properties.
4) Inherit(Default):- So, this is the default one. This basically relies on whatever immediate parent specifies.

so, why basically client id controls are really important?

Hmmm, that’s because, the gradual shift of web programming towards client side like with the inclusion of jquery libraries, other 3rd party JS libraries, where in you need to couple the controls on the rendered page or before rendering with certain activity, may be to validate them or tweak the controls during load time, i mean whatever, but for handling the same you should be familiar with the naming conventions of the rendered client ids.

So, let’s go and try out Client ID Mode. So, am going to test the same with a very basic sample Asp.Net website template.

clientIDMode_2

 

Now, here in the above case i have set the clientIdMode=”AutoID”, which means the page will behave as it used to be in 3.5 version and earlier. So, now see that what kind of identifier was generated for the same.

clientIDMode_3rd

clientIDMode_4th see, this was the identifier which is being generated. so, @ this stage if i have do certain client side validations on these kind of ids, this is going to be real mess.

now, look @ the behavior in the default mode which is predictable mode.

clientIDMode_5th

since, am using master page, hence it took the content page name and concatenated with my label name, so this is somewhat very obvious which we can take into account and write the script terminology based on that.

However, my personal favorite is clientIdMode =”‘Static”  which means whatever am typing as my identifier name, same is going to be rendered in there on the page as shown below.

clientIDMode_6th

clientIDMode_7th

 

and in case of inherited, it is going to produce the same result as it produced in the case of Predictable, because i have set the same @ top level. hence that is going to inherit from the same. so, with this I would like to wrap this. Thanks for your time. Till then, stay tuned and happy coding.

Thanks,
Rahul
Happy coding