Question

I’m trying to toggle two functions. When user clicks the pause button, the input fields are disabled, the label is text is changed to grey and the button changes to a different image. I thought I could use .toggle(), but I can’t get the two functions to work either — only the first one function runs (pauseEmailChannel();), not both on toggle click. I found the even/odd clicks detection script here on SO, but that is not “toggling” these two functions on the click event. My code may be ugly code, but I’m still learning and wanted to show how I am thinking — right or wrong. At any rate, can someone give me a solution to how to do this? I didn’t think it would be too difficult but I’m stuck. Thanks.

HTML

jQuery

      $(".btn_pause").click(function(){
    var count = 0;
        count++;
    //even odd click detect 
    var isEven = function(num) {
        return (num % 2 === 0) ? true : false;
    };
    // on odd clicks do this
    if (isEven(count) === false) {
        pauseEmailChannel(); 
    }
    // on even clicks do this
    else if (isEven(count) === true) {
        restoreEmailChannel(); 
    }
     });


    // when user clicks pause button - gray out/disable     
function pauseEmailChannel(){   
        $("#channel-email").css("color", "#b1b1b1");
        $("#notify-via-email").attr("disabled", true);
        $("#pause-email").removeClass("btn_pause").addClass("btn_disable-pause");
}



// when user clicks cancel button - restore default
function restoreEmailChannel(){
        $("#channel-email").css("color", "#000000");
        $("#notify-email").attr("disabled", false);
        $("#pause-email").removeClass("disable-pause").addClass("btn_pause");
        $("input[value='email']").removeClass("btn_disable-remove").addClass("btn_remove");
}

Answer 1

try this code. It should work fine, except that I could make a mistake when it is even and when odd, but that should be easy to fix.

  $(".btn_pause").click(function(){
    var oddClick = $(this).data("oddClick");
    $(this).data("oddClick", !oddClick);
    if(oddClick) {
        pauseEmailChannel(); 
    }
    else {
        restoreEmailChannel(); 
    }
  });