FormSanity Attributes

Unless a field is required, it is always valid when empty — even if other attributes are applied.

Required
Text:

this is an annotation

Password:

this is an annotation

File:

this is an annotation

Select List:

this is an annotation

Multi-Select List

this is an annotation

Text Area

this is an annotation

Radio Buttons

this is an annotation

Checkboxes

this is an annotation

Required Group
One or More Required
All Required:
Credit Card Expiration
One or More Required (arrays)
Red Shirt
Blue Shirt
None or All Required
First Name Last Name Date Start Time End Time

Needs correct answers.

Submit
<input type="text" fs_required="true" />
<input type="password" fs_required="true" />
<input type="file" fs_required="true" />
<select fs_required="true">
  <option selected="selected" disabled="disabled" value="">choose…</option>
  <option value="1">Cras aliquam massa ullamcorper sapien</option>
  <option value="2">Cras rutrum pulvinar tellus</option>
  <option value="3">Vivamus convallis urna id felis</option>
  <option value="4">Curabitur quis dui sit amet elit luctus aliquam</option>
  <option value="5">Quisque in wisi quis orci tincidunt fermentum</option>
  <option value="6">Donec non tortor in arcu mollis feugiat</option>
  <option value="7">Aliquam adipiscing libero vitae leo</option>
  <option value="8">Cras rutrum pulvinar tellus</option>
  <option value="9">Maecenas tempus dictum libero</option>
  <option value="10">Sed accumsan quam ac tellus</option>
</select>
<select size="6" multiple="multiple" fs_required="true">
  <option selected="selected" disabled="disabled" value="">choose…</option>
  <option value="1">Cras aliquam massa ullamcorper sapien</option>
  <option value="2">Cras rutrum pulvinar tellus</option>
  <option value="3">Vivamus convallis urna id felis</option>
  <option value="4">Curabitur quis dui sit amet elit luctus aliquam</option>
  <option value="5">Quisque in wisi quis orci tincidunt fermentum</option>
  <option value="6">Donec non tortor in arcu mollis feugiat</option>
  <option value="7">Aliquam adipiscing libero vitae leo</option>
  <option value="8">Cras rutrum pulvinar tellus</option>
  <option value="9">Maecenas tempus dictum libero</option>
  <option value="10">Sed accumsan quam ac tellus</option>
</select>
<textarea rows="5" cols="60" fs_required="true"></textarea>
<ul>
  <li><input name="required_radio" type="radio" value="01" fs_required="true" />Option One</li>
  <li><input name="required_radio" type="radio" value="02" fs_required="true" />Option Two</li>
</ul>
<ul>
  <li><input name="required_radio" type="radio" value="03" fs_required="true" />Option Three</li>
  <li><input name="required_radio" type="radio" value="04" fs_required="true" />Option Four</li>
</ul>
<ul>
  <li><input name="required_radio" type="radio" value="05" fs_required="true" />Option Five</li>
  <li><input name="required_radio" type="radio" value="06" fs_required="true" />Option Six</li>
</ul>
<ul>
  <li><input name="required_radio" type="radio" value="07" fs_required="true" />Option Seven</li>
  <li><input name="required_radio" type="radio" value="08" fs_required="true" />Option Eight</li>
</ul>
<ul>
  <li><input name="required_radio" type="radio" value="09" fs_required="true" />Option Nine</li>
  <li><input name="required_radio" type="radio" value="10" fs_required="true" />Option Ten</li>
</ul>
<ul>
  <li><input name="required_checkbox" type="checkbox" value="01" fs_required="true" />Option One</li>
  <li><input name="required_checkbox" type="checkbox" value="02" fs_required="true" />Option Two</li>
</ul>
<ul>
  <li><input name="required_checkbox" type="checkbox" value="03" fs_required="true" />Option Three</li>
  <li><input name="required_checkbox" type="checkbox" value="04" fs_required="true" />Option Four</li>
</ul>
<ul>
  <li><input name="required_checkbox" type="checkbox" value="05" fs_required="true" />Option Five</li>
  <li><input name="required_checkbox" type="checkbox" value="06" fs_required="true" />Option Six</li>
</ul>
<ul>
  <li><input name="required_checkbox" type="checkbox" value="07" fs_required="true" />Option Seven</li>
  <li><input name="required_checkbox" type="checkbox" value="08" fs_required="true" />Option Eight</li>
</ul>
<ul>
  <li><input name="required_checkbox" type="checkbox" value="09" fs_required="true" />Option Nine</li>
  <li><input name="required_checkbox" type="checkbox" value="10" fs_required="true" />Option Ten</li>
</ul>
<select name="required_group_select_1" fs_required_group="required_group_select:all">
  <option value="1">Option One</option>
  <option value="2">Option Two</option>
  <option value="3">Option Three</option>
</select>
<select name="required_group_select_2" fs_required_group="required_group_select:all">
  <option value="1">Option One</option>
  <option value="2">Option Two</option>
  <option value="3">Option Three</option>
</select>
<span fs_marker="required_group_select_1 required_group_select_2"></span>
<input name="club_seats" type="text" fs_required_group="ticket_type:at_least_one" />
<input name="box_seats" type="text" fs_required_group="ticket_type:at_least_one" />
<input name="bleacher_seats" type="text" fs_required_group="ticket_type:at_least_one" />
<tr>
  <td><input name="college1" type="text" fs_required_group="college1:none_or_all" /></td>
  <td>
    <select name="college1Year" fs_required_group="college1:none_or_all">
      <option selected="selected" disabled="disabled" value="">choose…</option>
      <option style="display:none" fs_year_offset="+0,-40"></option>
    </select>
  </td>
  <td><input name="college1Hours" type="text" fs_required_group="college1:none_or_all" /></td>
  <td>
    <input name="college1Degree" type="text" fs_required_group="college1:none_or_all" />
    <span fs_marker="college1 college1Year college1Hours college1Degree"></span>
  </td>
</tr>