Simple alertify confirm not working

UltraSonja picture UltraSonja · Aug 3, 2015 · Viewed 7.4k times · Source

I'm implementing a simple alertify confirm that's inside a regular JS function. I'm using the onclick attribute in my HTML to call this function, which should then execute the alertify code, but nothing happens when I click the button. Also, all of the documentation I found for alertify completely excludes HTML. So maybe I am not implementing it correctly in the HTML? Also, nothing is appearing in Chrome's JS debugger. So, I am referencing the library correctly at the very least.

HTML

<button class="btn btn-primary" onclick="confirmButton()">Rebuild</button>  

JS

function confirmButton() {

    alertify.confirm("Are you sure?",
          function(){
            alertify.success('Yes');
          },
          function(){
            alertify.error('No');
          });
}

Answer

Oskar picture Oskar · Aug 3, 2015

If you want to, you can fix it by doing this:

confirmButton = function() {
    alertify.confirm("Are you sure?",
          function(e){
                if(e){
                    alertify.success('Yes');
                } else {
                    alertify.success('No');
                }
          });
}

The problem stems from the function not being available to the caller. The fix works by making the function available globally. However, inline JS is pretty bad practice in general and I'd suggest not using this. Event handlers are a much better practice, jQuery's click handler would work pretty well here:

 $(document).ready(function() {
      $('button.btn-primary').click(function(){
           alertify.confirm("Are you sure?",
                function(e){
                if(e){
                    alertify.success('Yes');
                } else {
                    alertify.success('No');
                }
          });
      });
 });