Bootbox Confirm Dialog problems

Question

Desafortunadamente, el doc. Bootbox (http://paynedigital.com/2011/11/bootbox-js-alert-confirm-dialogs-for-twitter-bootstrap) no enseña cómo llamar al cuadro de diálogo de confirmación. Como está en la ventana del documento siempre aparece cuando se carga la página, lo que está mal, debe aparecer cuando se le llama haciendo clic en un botón Eliminar. Este es el código que intentó infructuosamente.

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

¿Cómo configuro este bootbox para que aparezca solo cuando se hace clic en el botón Eliminar? Gracias!

EDITAR -Solución:

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

Ahora, la eliminación funciona cuando hago clic en "sí". Le pedí a los desarrolladores del complemento que coloquen la muestra completa en el documento, por lo que los usuarios no necesitan crear publicaciones sobre cómo eliminar el objeto cuando se hace clic en "sí". Saludos.

Answer 1

Es posible que desee comprobar la fuente en el enlace "Confirmar" bajo "Uso básico" en esta página: http://bootboxjs.com/

He aquí un fragmento:

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

Suponiendo jQuery está disponible en la interfaz de usuario se Estoy trabajando, evitaría usar un atributo onClick en sus etiquetas de anclaje. Solo mis dos centavos.

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

que necesitaba eso también, pero he cambiado un poco algunas cosas ... Tome una mirada ...

Añadir esta función en su función global "jQuery Ready" de esa manera:

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

Y sólo tiene que añadir algunos atributos "Data- *" a su botón o enlace de esa manera:

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

Así que ... de esta manera usted puede tener ap pregunta ersonalizada ... Esto es mucho más intuitivo para sus usuarios ...

¿Te gustó ?!

Ver demostración: jsfiddle