Question

I have a strange behaviour in my ajax posting. First, I display an anchor link with the class ‘remove-link’. From this link, I get the target URL in the variable removeLinkObj. Next, I show a jquery ui dialog to ask the user to confirm. Then I do the ajax call with the url removeLinkObj.

The problem is that in STEP1 the link is (for example) ../../43 and in STEP2 the link is ../../42. So it is the previous value! Why is the value not the right one? I don’t know if I’m clear?

The aim of my code is to ask confirmation to the user (through a jquery ui dialog) before posting.

$().ready(function () {

var removeLinkObj;

$('.remove-link').click(function () {
    // STEP1
    removeLinkObj = $(this);  //for future use
    $('#confirm-remove').dialog('open');
    return false; // prevents the default behaviour
});

$('#confirm-remove').dialog({
    autoOpen: false, width: 500, resizable: false, modal: true,
    buttons: {
        "Continue": function () {
            // STEP2
            $.ajax({
                type: "Delete",
                url: removeLinkObj[0].href,
                cache: false,
                success: function (data) {
                    alert(data.TransportedMaterialId);
                    $("#" + data.TransportedMaterialId).remove();
                }
            });
            $(this).dialog("close");
        },
        "Cancel": function () {
            alert('User clicked Cancel');
            $(this).dialog("close");
        }
    }
});

})

And in my html:

<a href="aa/bb/44" class="remove-link">Delete</a>

Thank you anyway.

Answer 1

you can pass a parameter to your dialog instead of using global data. Before calling $('#confirm-remove').dialog('open')
add $('#confirm-remove').data('href', <get your href>);
and in you step 2 you can get the href:

 $(this).data('href');