Question

i’ve been trying to get a confirm box to work, i am using php and jquery to make a confirm box appear when clicking on a delete link, actual code :

$(document).ready(function(){
    if (jQuery("a.delete-link").length > 0) {
        $("a.delete-link").bind("click", function(){
            return confirm("Sunteti sigur ca doriti sa stergeti?");
        });
    }
});

and the link is called :

<a href="javascript:void(0);" class="formSubmit delete-link" id="sterge">sterge</a>

the link is used to submit a form when clicked, the code for that is :

$(document).ready(function(){
    if ($(".formSubmit").length > 0) {
        if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
            $(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
        }
        $(".formSubmit").click(function(){
            $(this).parents("form").trigger("submit");
            return false;
        });
    }
});

i do get the confirm dialog, but any option i chose, the form submits and the delete action is called.. any idea what i’m doing wrong ?

Answer 1

You have two click events bound to the anchor tag. The first event shows the confirm and the second submits the form.

Trigger the form submission only if the user confirmed:

$(document).ready(function(){
    if ($(".formSubmit").length > 0) {
        if ($(".formSubmit").parents("form").find("input:submit").length == 0) {
            $(".formSubmit").parents("form").append('<div style="width:1px;height:1px;overflow:hidden;"><input style="width:0;height:0;overflow:hidden;" type="submit" /></div>');
        }
        $(".formSubmit").click(function(){
            if ($(this).hasClass('delete-link') && confirm("Sunteti sigur ca doriti sa stergeti?"))
            {
                $(this).parents("form").trigger("submit");
            }
            return false;
        });
    }
});