Question

I’m trying to use the jQuery UI Dialog to display a confirmation prior to executing the action…in this case navigating to the selected link….but in another case, I might like to use AJAX delete.

I thought I could pass the action as parameter of the custom_confirm function:

   $("a.edit").click(function(e){
       e.preventDefault();
       custom_confirm('Please Note:',
           function(){
               location.href = $(this).attr('href');
           }
       );
   });

   function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
    if ($("#confirm").length == 0){
        $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
        $("#confirm").dialog({buttons: {'Proceed': function(){ $(this).dialog('close'); action; }, Cancel: function(){ $(this).dialog('close'); }}});
    }
    else {
        $("#confirm").html(prompt);
        $("#confirm").dialog('open');
    }
}

It’s not working. Is there another way to accomplish this?

---

Thanks for the quick responses guys. I tried your suggestion, but it’s still not executing function that is passed as parameter.

    $("a.edit").click(function(e){
       e.preventDefault();
       var href = $(this).attr('href');
       custom_confirm('Please Note:',
           function(){
console.log(href);
               location.href = href;
           }
       );
   });

---

Cleaned up the custom_confirm function, added the close option:

function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
    $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
    $("#confirm").dialog({position: 'top', width: 700, modal: true, resizable: false, show: "fold", hide: "blind", buttons: {'Proceed': function(){ $(this).dialog('close'); action(); }, Cancel: function(){ $(this).dialog('close'); }}, close: function(ev, ui) { $(this).remove();}});
}

Answer 1

Figured it out. If you are passing a function as a parameter to another function, you need to call the parameter as a funciton

action()

Instead of as a variable

action

Hope that helps

$("a.edit").click(function(e){
    e.preventDefault();
    var href = $(this).attr('href');
    custom_confirm('Please Note:',
        function(){
            location.href = href;
        }
    );
});

function custom_confirm(prompt, action, title){
    if (title === undefined) title = "Are you sure?";
        if ($("#confirm").length == 0){
            $("#main div.inner").append('<div id="confirm" title="' + title + '">' + prompt + '</div>');
            $("#confirm").dialog({buttons: {'Proceed': function(){ $(this).dialog('close'); action(); }, Cancel: function(){ $(this).dialog('close'); }}});
        }
        else {
            $("#confirm").html(prompt);
            $("#confirm").dialog('open');
    }
}