2017-09-20 6 views
0

Confirmer la boîte de dialogue a 3 boutons, ok, cancel and close. Je veux effectuer différentes actions sur ok et annuler le bouton mais rien sur la fermeture de la boîte de dialogue. Comment puis-je réaliser cela en utilisant javascript?Excute le code différent selon ok, annule et ferme le bouton dans la boîte de dialogue de confirmation?

+0

Il seulement a vraiment ok ou annuler (fermer est compté comme annuler): https://developer.mozilla.org/en-US/docs/Web/API/Window/confirm, je ne vois pas pourquoi vous ne feriez pas le annuler la fonction sur clo chantez la boîte car vous annulez effectivement le dialogue – Pete

+0

La boîte de dialogue Confirmer n'a que 2 boutons: ok et annuler. par exemple. confirmez ("Appuyez sur un bouton!"); –

+0

Ya, vrai, mais considérez la situation, je veux imprimer "OK" lorsque vous appuyez sur OK, "ANNULER" lorsque vous cliquez sur Annuler et rien à la fermeture de la boîte de dialogue, c'est mon exigence. Il imprimera "CANCLE" dans les deux cas si j'ai appuyé sur la fenêtre d'annulation ou de fermeture. – ppmakeitcount

Répondre

1

Ce n'est pas possible, mais vous pouvez utiliser JQuery-ui Dialog à la place.

Cet exemple ignorer l'action à proximité modale, seule une action sur 'Ok' et 'Annuler':

$("#dialog-confirm").dialog({ 
     modal: true, 
     buttons: { 
     "Ok": function() { // On Ok click 
      $(this).dialog("close"); 
     }, 
     "Cancel": function() { // On Cancel click 
      $(this).dialog("close"); 
     } 
     } 
}); 
+0

Merci, mais j'ai la restriction d'utiliser javascript seulement. – ppmakeitcount

+0

Donc, vous n'avez pas le choix. Faites votre propre dialogue ... – GGO

0

vous pouvez faire à travers jquery.ui dialogue

vous avez également besoin jquery-ui.min.js

ConfirmDialog('confirm dialog'); 

function ConfirmDialog(message){ 
$('<div></div>').appendTo('body') 
     .html('<div><h6>'+message+'?</h6></div>') 
     .dialog({ 
      modal: true, 
      title: 'cancel click message', 
      zIndex: 10000, 
      autoOpen: true width: 'auto', 
      resizable: false, 
      buttons: { 
         Yes: function() { 
          $('body').append('<h1>Confirm Dialog Result: <i>Yes</i></h1>'); 
          $(this).dialog("close"); 
         }, 
         No: function() {                
          $('body').append('<h1>Confirm Dialog Result: <i>No</i></h1>');        
          $(this).dialog("close"); 
         } 
        }, 
        close: function (event, ui) {              
         alert('close'); 
         $(this).remove(); 
        } 
       }); 
};