单击对话框确认项后继续重定向

时间:2013-09-12 11:23:03

标签: jquery html jquery-ui jquery-ui-dialog

我正在使用jQuery对话框确认链接点击,但在继续使用默认事件处理程序之前,对话框不会等待正确的确认。我错过了什么?

这是我的代码:

jQuery(function($) {
    $( "#dialog-submit-vp-confirm" ).dialog({
        autoOpen: false,
        resizable: false,
        modal: true,
        buttons: {
            "Submit to VP": function() {
                // Proceed with click here
            },
            Cancel: function() {
                $(this).dialog( "close" );
                return false;
            }
        }
    });

    $("#submit_to_vp").click(function(e) {
        $( "#dialog-submit-vp-confirm" ).dialog("open");
    });
});

HTML

<div id="dialog-submit-vp-confirm" title="Submit to your VP">
    <p><span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>Your plan will now be submitted to your VP. Are you sure you want to proceed?</p>
</div>
<a href="' . JURI::root() . 'api/submit_plan.php?plan_id=' . $plan_id . '" class="btn button" style="float: right;" id="submit_to_vp">Submit to VP</a>

请忽略HTML中的任何PHP / Joomla。

提前致谢。

2 个答案:

答案 0 :(得分:0)

使用event.preventDefault()

 $("#submit_to_vp").click(function(e) {
     e.preventDefault();
     $( "#dialog-submit-vp-confirm" ).dialog("open");
 });

答案 1 :(得分:0)

我在这里得到了答案:http://forum.jquery.com/topic/how-do-i-make-the-dialog-widget-modal-confirmation-redirect-to-another-site-when-i-click-one-of-the-options

感谢您的回答。

我将代码更改为:

jQuery(function($) {
    var href = "";

    $( "#dialog-submit-vp-confirm" ).dialog({
        autoOpen: false,
        resizable: false,
        modal: true,
        buttons: {
            "Submit to VP": function() {
                // Proceed with click here
                location = href;
            },
            Cancel: function() {
                $(this).dialog( "close" );
            }
        }
    });

    $("#submit_to_vp").click(function(e) {
        href=this.href;
        $("#dialog-submit-vp-confirm").dialog("open");
        return false;
    });
});