2010-05-21 17 views
8

Sto cercando di fare una finestra di conferma utilizzando jQuery, ma la forma non viene presentato a tutti, questo è quello che ho ottenuto:dialogo jquery: confermare il clic su un pulsante di invio

<script type="text/javascript"> 
    var currentForm; 
    $(function() { 
     $("#dialog-confirm").dialog({ 
      resizable: false, 
      height: 140, 
      modal: true, 
      autoOpen: false, 
      buttons: { 
       'Delete all items': function() { 
        currentForm.submit(); 
        $(this).dialog('close'); 
       }, 
       Cancel: function() { 
        $(this).dialog('close'); 
       } 
      } 
     }); 
    }); 

    function ask() { 
     currentForm = $(this).closest('form'); 
     $("#dialog-confirm").dialog('open'); 
    } 
</script> 
<form ... > 
    <input type="submit" value="delete" onclick="ask();return false;" /> 
</form> 

risposta

16

è necessario avere il pulsante di dialogo presentare il <form>, in questo modo:

   'Delete all items': function() { 
        $(this).dialog('close'); 
        $("#myForm").submit(); 
       } 

Il resto del codice è corretto, ma al momento è solo chiudendo la finestra di dialogo e restituendo, è necessario inviare effettivamente il modulo. Inoltre, è meglio fare questo come un gestore di clic, invece di onclick, come questo (aggiornamento per i commenti):

var currentForm; 
    $(function() { 
     $("#dialog-confirm").dialog({ 
      resizable: false, 
      height: 140, 
      modal: true, 
      autoOpen: false, 
      buttons: { 
       'Delete all items': function() { 
        $(this).dialog('close'); 
        currentForm.submit(); 
       }, 
       'Cancel': function() { 
        $(this).dialog('close'); 
       } 
      } 
     }); 
     $(".delete").click(function() { 
      currentForm = $(this).closest('form'); 
      $("#dialog-confirm").dialog('open'); 
      return false; 
     }); 
    }); 

Poi basta dare il vostro <input> una classe di delete, come questo:

<input class="delete" type="submit" value="delete" /> 
+1

il problema è che ho un sacco di moduli, ognuno con un pulsante di cancellazione al suo interno, è solo un input nascosto ' 'che fa la differenza tra queste forme – Omu

+0

Potrei dare ai nomi/id diversi nomi, il nome potrebbe contenere form + theId – Omu

+1

@Omu - È possibile memorizzare un" currentForm = '$ (this) .closest ('form') 'nella funzione clic quando si apre, quindi basta chiamare' currentForm.submit() 'nel gestore del pulsante di cancellazione, non sono necessari ID ... e basta cambiare il gestore di clic per eliminare un selettore di classe o attributo. –

4

Se stai usando jQuery, quindi farlo correttamente ed evitare in linea Javascript:

$(function(){ 
    $("form").submit(function(){ 
    // return false if you don't want this to be submitted 
    // maybe do a 
    // return ask(); 
    // but with the code provided it doesn't seem 
    // to work like that - ask() is not returning anything at all! 
    }); 
}); 
0

questo ha funzionato per me:

$(function() { 
    $("#accordion").accordion({ 
     heightStyle: "content" 
    }); 

    function confirmDialog(title, message, success) { 
     var confirmdialog = $('<div></div>').appendTo('body') 
      .html('<div><h6>' + message + '</h6></div>') 
      .dialog({ 
       modal: true, 
       title: title, 
       zIndex: 10000, 
       autoOpen: false, 
       width: 'auto', 
       resizable: false, 
       buttons: { 
        Yes: function() { 
         success(); 
         $(this).dialog("close"); 
        }, 
        No: function() { 
         $(this).dialog("close"); 
        } 
       }, 
       close: function() { 
        $(this).remove(); 
       } 
      }); 

     return confirmdialog.dialog("open"); 
    } 

    $('form').on('submit', function (e) { 
     e.preventDefault(); 
     var form = this; 

     confirmDialog('Confirm', 'Are you sure?', function() { 
      form.submit(); 
     }); 
    }); 
}); 

Riferimento: http://jsfiddle.net/pmw57/67Ge2/

Problemi correlati