Software Ninja: Using HTML5 Input types with Spring 3.0 form tags

Wednesday, January 26, 2011

Using HTML5 Input types with Spring 3.0 form tags

HTML5 supports various input types including email, url and tel. There is a lack of documentation for using these new types with the Spring form taglib. After trial and error I tried:

<form:input type="tel" alt="Home Phone" path="homePhone"/>

which surpisingly enough produced the expected code:

<input type="tel" alt="Home Phone" value="" name="homePhone" id="homePhone">

It is nice when something follows the principle of least astonishment.

4 comments:

maduxi said...: If i use type="color", the result html is type="text" type="color", setting the attribute type twice.

Did u do something to avoid this behaviour?; April 27, 2011 at 7:20 AM
Matthew O. Smith said...: I tried color and it worked as well. Be sure you are in the form:form and using the correct tablib reference:

<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form" %>; April 27, 2011 at 9:04 AM
Anonymous said...: Using that same taglib, inside a tag, results in two type attributes as well.

I've tried Chrome and iOS Safari, and they're understanding the correct one of the two, but there are definitely two in the returned HTML.; June 30, 2011 at 10:14 AM
coseats.com said...: Did anyone find a fix for this yet? I'm having the same problem. I'm using:

which results in two type attributes: type="tel" type="text"; November 13, 2011 at 3:27 PM