Tristate

Tristate controls comprise of a surround and 3 styles, toggled by optional attributes and classes. The attribute should be added to the <input> tag, and classes should follow on from the surrounding <div> and <label>.

Style	Attribute	Value	Example

Standard			Tristate
Standard - Label First			Tristate
Standard - Alternate Value	class	altstate	Tristate
Disabled	class disabled	disabled disabled	Tristate
Invalid	class	invalid	Tristate

    
      <div class="form-group tristate">
        <input type="hidden" class="value" value="<!-- Input value goes here -->">
        <input type="hidden" class="altvalue"  value="<!-- Input alternate value goes here -->">
        <input type="checkbox" class="form-control" id="<!-- Input control ID goes here -->" name="<!-- Input control name goes here -->" value="<!-- Input selected value goes here -->">
        <label for="<!-- Input control ID goes here -->">
          <span class="checkbox-icon"></span>
          Tristate
        </label>
      </div>