Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
HTML5 input tags module for Play 2.0
Branch: master
Pull request Compare This branch is 104 commits behind loicdescotte:master.

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
app/html5
conf
project
README.md

README.md

HTML5 input tags module for Play 2.0

This tags add client side validation attributes (required, max|min length) and formats (date, number, email...) to Play 2.0 templates.

Attributes are generared from the constraints defined on the model, e.g. Required constraint on a field.

They can generate several kinds of input :

  • text
  • email (validates that it's an email pattern)
  • tel (enables numeric keypad on mobile)
  • number (enables numeric keyboard on mobile, and specific input on other browsers)
  • date (enables date selection)
  • url (validates that it's an url pattern)
  • search (enables special display for this kind of input)
  • password

Example :

@import html5.tags.html._

@text(form("name"), 'label -> "Your name : ")
@number(form("age"), 'label -> "Your age : ") 

If your model contains this :

@Constraints.Required
@Constraints.MaxLength(10)
public String name;

public Integer age;

The generated output will be :

<input type="text" id="name" name="name" value="" label="Your name : " required maxlength="10">
<input type="number" id="age" name="age" value="" label="Your age : ">

Then the browser will check that the author field is not empty and the age input is a number, before sending to server. It will also limit the length of the author input.

Note : you can check browsers compatibility for this new attributes here

A few examples with pictures

Email validation :

Image

Telephone number keyboard (on Safari mobile) :

Image

How to install it

As the Play2 public module respository is not available yet, you will have to install it in your own repository. In the Play2-HTML5Tags folder, run play, then run publish-local.

In your application, add this configuration to the project/Build.scala file :

val appDependencies = Seq(
  "com.loicdescotte.coffeebean" % "html5tags_2.9.1" % "1.0-SNAPSHOT"
)

val main = PlayProject(appName, appVersion, appDependencies, mainLang = JAVA).settings(
    resolvers += "Local Play Repository" at "file://your-path-to-Play2/repository"
)
Something went wrong with that request. Please try again.