Radio buttons and checkboxes: label without a for

[avernet]

We generate a label without a for, which is an issue per WCAG2 1.3.1 (A), reported as E885 by TotalValidator. As in the case of #2221, we "should" generate a fieldset, but it works to generate a span instead of a label, and the appropriate role="group | radiogroup" aria-labelledby="label" on the container. Note that for radio buttons we should generate radiogroup, for checkboxes just group.

[avernet]

E.g. we'd like to have (corresponding jsBin):

    <span>
      <span id="my-label" class="xforms-label">Checkboxes</span>
      <span class="xforms-items" role="group" aria-labelledby="my-label">
        <label>
          <input id="my-checkbox-1" type="checkbox" value="0">
          <span>First choice</span>
        </label>
      </span>
    </span>

Changes:

• Added attributes role="group | radiogroup" aria-labelledby="my-label" on the element with class xforms-select-appearance-full | xforms-select1-appearance-full.
• Label generated using span instead label, and has id so it can be referenced by the container.

[avernet]

For a discussion of whether using a aria-labelledby="…" (and in this case a role="group | radiogroup") is an acceptable alternative to using a <label for="…"> (in this case pointing to a <fieldset>), see Can an input be “labeled” with a aria-labelledby instead of a ?.