Skip to content

Instantly share code, notes, and snippets.

@slaskis

slaskis/forms.html

Created October 7, 2011 17:27
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save slaskis/1270857 to your computer and use it in GitHub Desktop.
Save slaskis/1270857 to your computer and use it in GitHub Desktop.
Download ZIP
Forms validation for Jade
Raw
forms.html
<!DOCTYPE html>
<html>
<head>
<title>Testing!</title>
</head>
<body>
<div id="main">
<form action="/" method="post">
<div class="error-field">
<input type="email" name="user[wrap_me]" placeholder="Enter your email" required class="hello">
<input type="hidden" name="validates.user[wrap_me]" value="type=email&amp;required">
<p class="error-message">Required field
</p>
<p class="error-message">Looking ugly
</p>
</div>
<fieldset>
<legend>Enter your user info
</legend>
<p>
<label>Name
<input type="text" name="user[name]" placeholder="Enter your name" required>
<input type="hidden" name="validates.user[name]" value="required">
</label>
</p>
<p>
<label class="error-field">Email
<input type="email" name="user[email]" placeholder="Enter your email" required value="test@example.com">
<input type="hidden" name="validates.user[email]" value="type=email&amp;required">
<p class="error-message">Does not match pattern
</p>
</label>
</p>
<p>
<label>Password
<input type="password" name="user[password]" placeholder="Enter your password" required>
<input type="hidden" name="validates.user[password]" value="type=password&amp;required">
</label>
</p>
</fieldset>
</form>
<form action="/" method="post" novalidate>
<fieldset>
<legend>Enter your user info
</legend>
<p>
<label>Name
<input type="text" name="user[name]" placeholder="Enter your name" required>
</label>
</p>
<p>
<label>Email
<input type="email" name="user[email]" placeholder="Enter your email" required value="test@example.com">
</label>
</p>
<p>
<label>Password
<input type="password" name="user[password]" placeholder="Enter your password" required>
</label>
</p>
</fieldset>
</form>
</div>
</body>
</html>
Raw
forms.jade
!!! 5
html
head
title Testing!
body
#main
form(action='/',method='post')
input(type='email',name='user[wrap_me]',placeholder='Enter your email',required,class='hello')
fieldset
legend Enter your user info
p
label
| Name
input(type='text',name='user[name]',placeholder='Enter your name',required)
p
label
| Email
input(type='email',name='user[email]',placeholder='Enter your email',required)
p
label
| Password
input(type='password',name='user[password]',placeholder='Enter your password',required)
form(action='/',method='post',novalidate)
fieldset
legend Enter your user info
p
label
| Name
input(type='text',name='user[name]',placeholder='Enter your name',required)
p
label
| Email
input(type='email',name='user[email]',placeholder='Enter your email',required)
p
label
| Password
input(type='password',name='user[password]',placeholder='Enter your password',required)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment