SharePoint HTML 5 controls

Is clear for me, with every technological step in SharePoint environment, Microsoft is getting closer to modern development and HTML 5. And I am talking here about SharePoint:InputFormTextBox control, which is a sort of improved version of classic asp:TextBox control. But let’s what is new in SharePoint Online (most probably in 2013 as well, but I did not test it yet).

Selecting date/date and time

SharePoint:InputFormTextBox can be easily displayed as an HTML 5 date picker control. Is important how do you set text mode property.

<SharePoint:InputFormTextBox runat="server" TextMode="DateTimeLocal"  />

However, being rendered as an HTML 5, is dependent of browser capabilities. In case it is not supported, you will still see a normal text input element.

As you can see, you also have a mask for entering the time. However, there is a simplified version to select only date (in fact is a different control, but please allow my poetic expression :)).

<SharePoint:InputFormTextBox runat="server" TextMode="Date"  />

In a similar way you can have a control for entering a time value.

<SharePoint:InputFormTextBox runat="server" TextMode="Time"  />


Range selector control

Range selector control is the second one on my list. Setting text mode to “Range” will do the trick. However, you can also additional HTML 5 range selector control attributes, like min and max value.

<SharePoint:InputFormTextBox runat="server" TextMode="Range" min="0" max="10"  />


Color picker control

Even is not likely to use this control in an enterprise system, is still there and is a good thing to know you have it available.

<SharePoint:InputFormTextBox runat="server" TextMode="Color"  />


Number control

Number control can be a real help in developing forms. So having the same syntax and just adjusting the text mode property, you can have one in your page.

<SharePoint:InputFormTextBox runat="server" TextMode="Number" min="1" max="6"  />

As you can see, there is no rocket science to have some server side controls rendering HTML 5 client side elements. However, there is something more there you can do. It seems all of these controls can do postback. For me, it seems SharePoint will become soon a reliable environment for web developers. And I am waiting for the day when all the browsers will have full support HTML 5.


Author: anvlpopescu

Nothing special to say. I'll think about it more and let your know.

One thought on “SharePoint HTML 5 controls”

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s