Originariamente inviata da
brancomat
dipende se vuoi qualcosa di "bello" graficamente (=> complicato e potenzialmente non compatibile con tutti i tipi di browser) oppure "brutto ma veloce".
Nel secondo caso
codice:
var r = confirm("Confermi di fare qualcosa");
if (r == true)
...
Nel primo metto un pannello bootstrap, lo faccio apparire in modalità modale,
poi lego a un bottone un evento javascript che lancia via Ajax la pagina php (!!!)
In pratica lato JS
codice:
jQuery("#btninvia").click(function(){
... roba varia...
... in elenco ad esempio ci metti la stringa GET...
$.ajax({
url : 'pagina.php',
data : elenco,
dataType : 'html',
complete: function (data) {
.. tante altre cose...
$('#pnlconferma').modal('hide');
$('#pnlfatto').modal('show') ;
}
});
qui ti serve un #
pnlconferma con un bottone con #
btninvia e magari un pannello #pnlfatto (se ti serve qualcosa del tipo "ho fatto quello che dovevo fare"
Il pannello conferma puoi farlo tipo così (in questo esempio metto due
lblregistrazione e lbldata fittizi in readonly, in modo che puoi compilarli da javascript
con qualcosa tipo per avere "sei sicuro di voler fare questo e questo?"
codice:
$(".modal-body #lblregistrazione").val( valore );
$(".modal-body #lbldata").val( miadata );
codice:
<div id="pnlconferma" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Conferma</h4>
</div>
<div class="modal-body">
<input type="text" id="lblregistrazione" value="" readonly/> in data <input type="text" id="lbldata" value="" readonly/>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Chiudi</button>
<button type="button" class="btn btn-primary" id="btninvia">Conferma</button>
</div>
</div>
</div>
</div>
Il pannello fatto (sempre bootstrap)
codice:
<div id="pnlfatto" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Informazioni</h4>
</div>
<div class="modal-body">
Fatto
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Chiudi</button>
</div>
</div>
</div>
</div>
Per innescare il tutto puoi usare (in questo esempio un qualsiasi bottone, altrimenti devi sistemare la jquery alla prima riga)
codice:
jQuery(".btn-primary").click(function(){
... nell'esempio imposto i due editbox a valore e mia data
$(".modal-body #lblregistrazione").val( valore );
$(".modal-body #lbldata").val( miadata );
... mostro il pannello ...
$('#pnlconferma').modal('show') ;
Rispondi quotando
