Hộp khởi động js: Thay đổi vị trí của Nút Ok

Question

Trong bootbox.js, theo mặc định nút Ok hiển thị sau nút Hủy. Tôi muốn nó là đầu tiên và sau đó hủy bỏ. Đây là tình huống của tình huống hiện tại,

http://paynedigital.com/img/confirm-simple.png

Tôi cần nút Ok trước. Tôi có cảnh tài liệu của nó nhưng không tìm được cách để làm điều đó.

Answer 1

Bạn có thể làm điều đó bằng CSS.

.modal-footer button { 
    float:right; 
    margin-left: 10px; 
} 

đây đang làm việc fiddle http://jsfiddle.net/9L3A9/51/

Answer 2

Bạn có thể thay đổi thứ tự của các nút. Hãy thử:

bootbox.confirm({ 
    title: "danger - danger - danger", 
    message: "Are you sure of this?", 
    buttons: { 
     cancel: { 
     label: "Cancel", 
     className: "btn-default pull-right" 
    }, 
    confirm: { 
     label: "Delete", 
     className: "btn-danger pull-left" 
    } 
    }, 
    callback: function(result) { 
    // Do your stuff here 
    } 
}); 

Hy vọng điều này phù hợp với bạn.

Answer 3

Tôi dành một giờ để xem vấn đề này, sau đó tôi đã thay đổi tệp bootbox.js.

Trước khi đếm các nút tôi đã thêm:

var list = Object.keys(buttons).map(
    function (key) { 
     return buttons[key]; 
    }); 

    buttons = list.sort(function (a, b) { 
     return b.order -a.order ; 
    }); 

Sau đó, bạn có thể thiết lập một trật tự cho các nút của bạn.

Ouf!

Answer 4

Tôi đã thay đổi trật tự trong javascript

exports.confirm = function() { 
    var options; 

    // changed the order of the buttons 
    //options = mergeDialogOptions("confirm", ["cancel", "confirm"], ["message", "callback"], arguments); 
    options = mergeDialogOptions("confirm", ["confirm", "cancel"], ["message", "callback"], arguments); 

Answer 5

tôi đã phải đối mặt với cùng một điều cần thiết. Tôi đã giải quyết theo cách này. Tôi đã lấy một lớp để tạo sự khác biệt 10 pixel giữa các nút.

<style> 
    .margin-left-10px { 
     margin-left: 10px; 
    } 
</style> 

Sau đó, tôi đã sử dụng lớp khởi động cho nút và nó hoạt động hoàn hảo.

<script> 
    buttons: { 
      confirm: { 
       label: 'Yes', 
       className: 'btn-danger' 
      }, 
      cancel: { 
       label: 'No', 
       className: 'btn-success pull-right margin-left-10px' 
      } 
    } 
</script> 

Ở đây, nút không có của tôi sẽ xuất hiện ở bên phải mãi mãi.