jQuery Bootbox 确认对话框问题

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/10543979/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 09:29:38  来源:igfitidea点击:

Bootbox Confirm Dialog problems

jquerytwitter-bootstrapbootbox

提问by LinuxMan

Unfortunately, the doc Bootbox ( http://paynedigital.com/2011/11/bootbox-js-alert-confirm-dialogs-for-twitter-bootstrap) not teach how to call the confirm dialog. As it is in the doc window always appears when the page is loaded, what is wrong, should appear when called by clicking on a delete button. This is the code that tried unsuccessfully.

不幸的是,文档 Bootbox ( http://paynedigital.com/2011/11/bootbox-js-alert-confirm-dialogs-for-twitter-bootstrap) 没有教如何调用确认对话框。由于它在页面加载时总是出现在文档窗口中,有什么问题,应该在通过单击删除按钮调用时出现。这是尝试失败的代码。

// show "false" does not work, the confirm window is showing when page is loaded.
$(function () {
bootbox.confirm("Confirm delete?", "No", "Yes", function(result) {
show: false
});     
});

// need show the confirm window when the user click in a button, how to call the confirm window?

<td><a class="icon-trash" onclick="bootbox.confirm();" href="{% url 'del_setor' setor.id %}" title="Delete"></a></td>

How do I set this bootbox to appear only when the delete button is clicked? Thanks!

如何设置此引导框仅在单击删除按钮时显示?谢谢!

EDIT -SOLUTION:

编辑 - 解决方案:

$(function () {
$("a#confirm").click(function(e) {
    e.preventDefault();
    var location = $(this).attr('href');
    bootbox.confirm("Confirm exclusion?", "No", "Yes", function(confirmed) {
        if(confirmed) {
        window.location.replace(location);
        }
    });
});     
});

Now, the deletion works when i click in "yes". I asked the developers of the plugin to put the full sample in the doc, so users do not need to create posts about how to remove the object when "yes" is clicked. Regards.

现在,当我点击“是”时,删除工作。我要求插件的开发人员将完整示例放在文档中,因此用户无需创建有关单击“是”时如何删除对象的帖子。问候。

采纳答案by jstam

You may want to check the source on the "Confirm" link under "Basic Usage" on this page: http://bootboxjs.com/

您可能需要检查此页面上“基本用法”下的“确认”链接上的来源:http: //bootboxjs.com/

Here's a snippet:

这是一个片段:

$("a.confirm").click(function(e) {
    e.preventDefault();
    bootbox.confirm("Are you sure?", function(confirmed) {
        console.log("Confirmed: "+confirmed);
    });
});

Assuming jQuery is available in the UI you're working on, I'd avoid using an onClickattribute in your anchor tags. Just my two cents.

假设 jQuery 在您正在处理的 UI 中可用,我会避免onClick在您的锚标记中使用属性。只有我的两分钱。

回答by Rodolpho Brock

I needed that too, but I changed a little few things... Take a look...

我也需要那个,但我改变了一些东西......看看......

Add this function into your global "jQuery Ready" function like that:

将此函数添加到您的全局“jQuery Ready”函数中,如下所示:

$(document).on("click", "[data-toggle=\"confirm\"]", function (e) {
    e.preventDefault();
    var lHref = $(this).attr('href');
    var lText = this.attributes.getNamedItem("data-title") ? this.attributes.getNamedItem("data-title").value : "Are you sure?"; // If data-title is not set use default text
    bootbox.confirm(lText, function (confirmed) {
        if (confirmed) {
            //window.location.replace(lHref); // similar behavior as an HTTP redirect (DOESN'T increment browser history)
            window.location.href = lHref; // similar behavior as clicking on a link (Increments browser history)
        }
    });
});

And just add some "data-* attributes" to your button or link like that:

只需在您的按钮或链接中添加一些“data-* 属性”:

<a class="btn btn-xs btn-default" data-toggle="confirm" data-title="Do you really want to delete the record 123?" href="/Controller/Delete/123"><span class="fa fa-remove"></span> </a>

So... This way you can have a personalized question.. This is much more intuitive for your users...

所以......这样你就可以有一个个性化的问题......这对你的用户来说更直观......

Did you liked?!

你喜欢吗?!

See demo: jsfiddle

见演示:jsfiddle

回答by Ali B.

Aspx Side For Grid LinkButton:

网格 LinkBut​​ton 的 Aspx 端:

<asp:LinkButton ID="LinkButton2" runat="server" CommandName="DELETE"  
    OnClientClick="javascript:return DeleteConfirm(this,'Are you Sure?');" CausesValidation="False" Text="Delete" > Delete
</asp:LinkButton>
    function DeleteConfirm(btn, msg) 
    { 
            if(msg==''){msg='Are You Sure ? ';}

            if ($(btn).attr('confirmOK')=='1'){return true;}

              bootbox.confirm({
                    title: 'Confirm Popup',
                    message: msg,                   
                    callback: function(result) {
                             if (result) 
                             { 
                                $(btn).attr('confirmOK', '1');
                                 btn.click();
                             }
                             else{
                               $(btn).attr('confirmOK', '0');
                             }
                    }
                });

            return false;
     };

回答by mdco

$(document).on("click", ".confirm-modal", function(e) {
    e.preventDefault();
    bootbox.confirm("Are You sure?", function(result) {
        if(result) {
            top.location.href = e.target.href;
        }
    });
});