CODEWITHSUNDEEP
jqueryjquery-ui-dialog
John
John

Reputation: 10146

Jquery load clicked link if confirmed from dialog box

I have this jquery code:

    $("#deletec-box").dialog({
    autoOpen:false,
    resizable:false,
    height:230,
    modal:true,
    buttons:{
        "Confirm":function(){
            window.location=$("a[id*='deletec-confirm']").attr('href');
            $(this).dialog("close");
        },Cancel:function(){
            $(this).dialog("close");
        }
    }
});

$("a[id*='deletec-confirm']").click(function(){
    $("#deletec-box").dialog("open");
    return false;
});

And in the web page I have:

<a href="?action=delc&cid=2" id="deletec-confirm2" title="Delete This Record">Delete</a>
<a href="?action=delc&cid=3" id="deletec-confirm3" title="Delete This Record">Delete</a>

When you click the second link above it uses the first links url to load. How can I get the jquery dialog box to get the correct url based on the link clicked above? All I want to do is if they click the delete link it asked to confirm, if they click the confirm button in the dialog box I want the url they originally click to proceed.

Upvotes: 0

Views: 584

Answers (1)

no.good.at.coding
no.good.at.coding

Reputation: 20371

I have two suggestions:

  1. Use the jQuery data API
    The idea here is to store the appropriate information at a known location and use that within your dialog. For example:

    $("#deletec-box").dialog({
    autoOpen:false,
    resizable:false,
    height:230,
    modal:true,
    buttons:{
        "Confirm":function(){
            window.location=$('#deletec-box').data('loc');
            $(this).dialog("close");
        },Cancel:function(){
            $(this).dialog("close");
        }
    }
});

$("a[id*='deletec-confirm']").click(function(){
    $('#deletec-box').data('loc', $(this).attr('href'));
    $("#deletec-box").dialog("open");
    return false;
});

  2. Modify the dialog when needed with the appropriate buttons. This might be too verbose though and more work than it's worth plus the overhead of creating a lot of objects.

    $("#deletec-box").dialog({
    autoOpen:false,
    resizable:false,
    height:230,
    modal:true,
});

$("a[id*='deletec-confirm']").click(function(){
    loc = $(this).attr('href');
    $('#deletec-box').dialog({
        buttons:{
                "Confirm":function(){
                    window.location=loc;
                    $(this).dialog("close");
                },Cancel:function(){
                    $(this).dialog("close");
                }
        }
    });
    $("#deletec-box").dialog("open");
    return false;
});

Upvotes: 2

Related Questions