Флажок не может поставить / снять галочку во вкладке

Question

Я пытаюсь поставить флажок на панели вкладок с левой стороны.Но флажок не может поставить или снять галочку.Может кто-нибудь помочь мне решить это?Это мой код и изображение того, что я пытаюсь сделать.

<aside class="sm-side">
<div role="tabpanel">
    <ul class="nav nav-pills brand-pills nav-stacked" role="tablist">
      <li role="presentation" class="brand-nav active" >
        <a href="#tab1" aria-controls="tab1" role="tab" data-toggle="tab">
           <input type="checkbox" id="eq1" >
           <label for="eq1">Resource 1</label>
        </a>
      </li>
      <li role="presentation" class="brand-nav"><a href="#tab2" aria-controls="tab2" role="tab" data-toggle="tab">Resource 2</a></li>
      <li role="presentation" class="brand-nav"><a href="#tab3" aria-controls="tab3" role="tab" data-toggle="tab">Resource 3</a></li>
      <li role="presentation" class="brand-nav"><a href="#tab4" aria-controls="tab4" role="tab" data-toggle="tab">Resource 4</a></li>
     </ul>
</div>
</aside>
<aside>
  <div role="tabpanel" class="tab-pane active" id="tab1">
    <p>Hello1</p>
  </div>
  <div role="tabpanel" class="tab-pane" id="tab2">
      <p>Hello 2</p>
  </div>
  <div role="tabpanel" class="tab-pane" id="tab3">
       <p>Hello 3</p>
  </div>
  <div role="tabpanel" class="tab-pane" id="tab4">
       <p>Hello 4</p>
  </div>
</aside>

Изображение того, что я пытаюсь сделать