Sunday, 5 June 2016

How to toggle class between two buttons

<div id="buttons">
  <button id="yes">Yes</button>
  <button id="no">No</button>
</div>




<script>
function bindButtons(){
  var buttons = $('#buttons button');

  buttons.on('click', function(e){
    var $this = $(this);
    buttons.removeClass('selected');
    if($this.attr('id') == 'yes'){
      var el = $('#no'),
          val = true;
      $this.removeClass('disabled');
      $this.addClass('selected');
      el.addClass('disabled');
    }
    if($this.attr('id') == 'no'){
      var el = $('#yes'),
          val = false;
      $this.removeClass('disabled');
      $this.addClass('selected');
      el.addClass('disabled');
    }
    //do something with val
  })
}
bindButtons();
</script>

No comments:

Post a Comment