twbs/bootlint

E21 when `.active` class used without the `checked`

Open

#312 opened on Sep 30, 2015

View on GitHub
 (1 comment) (0 reactions) (0 assignees)JavaScript (2,394 stars) (368 forks)batch import
bughelp wanted

Description

PROBLEM:

I have this when my page loads:

<div class="btn-group form-control-radio" data-toggle="buttons" id="tipo">
    <label class="btn btn-default">
        <input type="radio" name="var_tipo" autocomplete="off" value="tipo1">Tipo1
    </label>
    <label class="btn btn-default">
        <input type="radio" name="var_tipo" autocomplete="off" value="tipo2">Tipo2
    </label>
</div>

This don't cause any errors, but when I click in one of them, the label now has the class .active which causes E21 error(https://github.com/twbs/bootlint/wiki/E021). I don't know if I'm making something wrong or if it's a bug. I read the docs and the examples are only with "checked" with no .active but no vise-versa.

DOCS:

.active class used without the checked attribute (or vice-versa) in a button group using the button.js plugin

Wrong:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary">
    <input type="checkbox" checked /> Option 1 (pre-checked)
  </label>
  <label class="btn btn-primary active">
    <input type="checkbox" /> Option 2 (not pre-checked)
  </label>
</div>

Right:

<div class="btn-group" data-toggle="buttons">
  <label class="btn btn-primary active">
    <input type="checkbox" checked /> Option 1 (pre-checked)
  </label>
  <label class="btn btn-primary">
    <input type="checkbox" /> Option 2 (not pre-checked)
  </label>
</div>

Contributor guide