title: Disable input-group-addon
body: <p>I would like to disable a datepicker when a checkbox is checked. But I can't disable the input-group-addon. Even if the text input is disabled, the user can click on the span and choose a date. </p>
  
  <p>How can I disable it ?</p>
  
  <p><a href="https://i.stack.imgur.com/UbkcX.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UbkcX.png" alt="Image of the inputs, I&#39;d like to disable the &quot;du&quot; and &quot;au&quot;"></a></p>
  
  <p>Here's my html code :</p>
  
  <pre><code>&lt;div class="col-md-4"&gt;
      &lt;div class="control-group"&gt;
          &lt;div class="input-group date" id="deb"&gt;
              &lt;div class="input-group-addon"&gt;Du&lt;/div&gt;
              &lt;input id="dateDebut" type="text" class="form-control"&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-4"&gt;
      &lt;div class="control-group"&gt;
          &lt;div class="input-group date" id="end"&gt;
              &lt;div class="input-group-addon"&gt;Au&lt;/div&gt;
              &lt;input id="dateFin" type="text" class="form-control"&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="col-md-3 checkbox"&gt;
      &lt;label&gt; &lt;input id='toutVisu' type="checkbox"&gt;Visu&lt;/label&gt; 
  &lt;/div&gt;
  </code></pre>
  
  <p>And here's my js code :</p>
  
  <pre><code>$('input#toutVisu').on('change', function(){
  
      if($(this).is(':checked')){
          $("div.date input").prop("disabled",true)
          $("div.date input").val("")
  
          msg = $('#messToutVisu').val()
          msgAlert = afficheAlert("danger",msg)
          $("div#histoRapport").append(msgAlert)
          deleteAlert()
      }else{
          $("div.date input").prop("disabled",false)
      }
  })
  </code></pre>
  
  <p>I tried a lot of things to disable this input but nothing worked. So I let what was already made. </p>
  
  <p>Thank you</p>