Hộp thoại Xác nhận các vấn đề về Dialog

Question

Thật không may, hộp đựng tài liệu Bootbox (http://paynedigital.com/2011/11/bootbox-js-alert-confirm-dialogs-for-twitter-bootstrap) không dạy cách gọi hộp thoại xác nhận. Vì trong cửa sổ tài liệu luôn xuất hiện khi trang được tải, có gì sai, nên xuất hiện khi được gọi bằng cách nhấp vào nút xóa. Đây là mã đã cố gắng không thành công.

// 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> 

Làm cách nào để đặt hộp khởi động này chỉ xuất hiện khi nút xóa được nhấp? Cảm ơn!

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); 
     } 
    }); 
});  
}); 

Bây giờ, việc xóa hoạt động khi tôi nhấp vào "yes". Tôi đã yêu cầu các nhà phát triển của plugin đưa mẫu đầy đủ vào tài liệu, vì vậy người dùng không cần phải tạo các bài đăng về cách xóa đối tượng khi "có" được nhấp. Trân trọng.

Answer 1

Bạn có thể muốn kiểm tra nguồn vào "Xác nhận" liên kết trong "Sử dụng cơ bản" trên trang này: http://bootboxjs.com/

Dưới đây là một đoạn:

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

Giả sử jQuery có sẵn trong giao diện người dùng bạn đang làm việc trên, tôi muốn tránh sử dụng thuộc tính onClick trong các thẻ neo của bạn. Chỉ cần hai xu của tôi.

Answer 2

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

Answer 3

tôi cần điều đó quá, nhưng tôi đã thay đổi một chút vài điều ... Hãy xem ...

Thêm chức năng này vào toàn cầu "jQuery Ready" chức năng của bạn như thế:

$(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) 
     } 
    }); 
}); 

Và chỉ cần thêm một số "* thuộc tính đĩa dữ liệu" để nút hoặc liên kết của bạn như thế:

<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> 

Vì vậy, ... Bằng cách này bạn có thể có ap câu hỏi cá nhân hóa .. Điều này trực quan hơn cho người dùng của bạn ...

Bạn có thích ?!

Xem bản trình diễn: jsfiddle