Skip to main content

Selector Strips v0.8.0+ HelixUI v0.8.0 or later required

Multi-Select

a.k.a. "checkbox strip"

<div class="hxSelector">
  <label>
    <input type="checkbox" name="a" />
    <span>a</span>
  </label>
  <label>
    <input type="checkbox" name="b" checked />
    <span>b</span>
  </label>
  <label>
    <input type="checkbox" name="c" disabled />
    <span>c</span>
  </label>
  <label>
    <input type="checkbox" name="d" invalid />
    <span>d</span>
  </label>
  <label>
    <input type="checkbox" name="e" invalid checked />
    <span>e</span>
  </label>
</div>

Single-Select

a.k.a. "radio strip"

<div class="hxSelector hxRadio">
  <label>
    <input type="radio" name="foo" checked />
    <span>1</span>
  </label>
  <label>
    <input type="radio" name="foo" />
    <span>2</span>
  </label>
  <label>
    <input type="radio" name="foo" disabled />
    <span>3</span>
  </label>
  <label>
    <input type="radio" name="foo" />
    <span>4</span>
  </label>
  <label>
    <input type="radio" name="foo" />
    <span>5</span>
  </label>
</div>