Use of "for" attribute of html label

I have noticed many of the html programmers that, they use an attribute called "for" when writing a label tag. And the attribute value is exactly same as the corresponding html input control such as text box, check box, drop down,... But I never tried to know the actual use of this attribute.

Very recently, I have searched in Google to know the use of it. Now I have come to know that, the "for" attribute of label binds the label with the corresponding control. Binding in the sense, when the user clicks on the label it toggles the corresponding control (control id passed as value for "for" attribute). This way the "for" attribute is used for the label. Now onwards I am going to make a good practice of using "for" attribute of the label control.

Let's see an example of the usage of the "for" attribute of label control

<label for="FirstName">First Name:</label>

<input id="FirstName" type="text">

The above code is rendered as shown below. You can test this behavior by clicking on the label "First Name:". You can notice the text box focused.

First Name:

How to post html code in blogspot / blogger

I had problem when posting an article on blogspot. I was trying to show some sample html/xml code in that article. But I faced problems when I wrote the core html code. The problem was that the html code was rendering as html controls and breaking the post content. I tried many times and got frustration. Finally I searched in google for this problem and I got the below useful link.

http://www.simplebits.com/cgi-bin/simplecode.pl

If you follow the above link you will notice 2 textareas in which the first one is for input the html code and second one is for output of the changed html code which fits into the blogspot post and renders as expected.

Whoever wants to post the html code in blogger, please go to the link and paste your html code in first text box control and click the process button. Then you will notice the second textbox updated with the processed html code. Then copy the complete code from second text box and paste it in your blogspot post. It works not only in blogspot but also in all blogs which don't allow direct html code in posts.

Impose maxlength on textarea controls to avoid "String or binary data would be truncated" error

As we all know that you can restrict a text box to allow limited number of characters using maxlength attribute as shown below

<input id="tbName" maxlength="20" type="textbox" width="100"/>

(or)

<asp:TextBox ID="tbName" MaxLength="20" Width="100px" runat="server" />

It is very simple and easy to impose the maximum length constraint for text boxes.

But this is not the case for textarea /multiline text box controls. There is no straight way to do this. We don't have the maxlength attribute for html textarea control. This post explains how to add that support.

Please check the below javascript function imposeMaxLength(field,maxChars) which takes 2 parameters:
- field which is the textarea control itself
- maxChars to tell the function how many charaters to be allowed.

<script type="text/javascript">
function imposeMaxLength(field,maxChars)
{
if(field.value.length > maxChars)
{
field.value = field.value.substring( 0, maxChars );
alert( 'Textarea value can only be ' +maxChars + ' characters in length.' );
return false;
}
}
</script>

The function needs to be called in onkeypress event of the textarea control. Please see the below code to know how we should call the method imposeMaxLength in onkeypress event of the textareancontrol

<textarea id="tbDescription" onkeypress="imposeMaxLength(this, 512)" />

(or)

<asp:TextBox ID="tbDescription" TexMode="MultiLine" runat="server" onkeypress="imposeMaxLength(this, 512)" />

The above code renders a text area control and restricts the control not to allow more than 512 characters.

This is very useful when you have database fields with limited string length. We have faced many pronlems as the user was entering bulky data and the field doesn't support and hence throws the exception. After implementing this we were comfortable and there were no exceptions like String or binary data would be truncated.