2010-07-31 4 views

Répondre

6

Peut être cela vous aidera:

$('#submitButtonID').click(function(){ 
alert('Please wait while form is submitting'); 
$('#formID').submit(); 
}); 
+2

'.clickfunction()'? Vous voulez dire '.click (function() {' – Harmen

+0

@Harmen .. Oui, en tapant erreur.Merci – sTodorov

+0

@Gaby merci pour l'édition – sTodorov

10

Après avoir cliqué sur un bouton submit habituellement le formulaire est soumis au serveur et toute l'exécution du script client arrête. Donc, sauf si vous AJAXify votre formulaire, cela ne fonctionnera pas. Pour AJAXify votre formulaire, vous pouvez joindre à l'événement submit et remplacer l'action par défaut:

$(function() { 
    $('#theForm').submit(function() { 
     // show a hidden div to indicate progression 
     $('#someHiddenDiv').show(); 

     // kick off AJAX 
     $.ajax({ 
      url: this.action, 
      type: this.method, 
      data: $(this).serialize(), 
      success: function() { 
       // AJAX request finished, handle the results and hide progress 
       $('#someHiddenDiv').hide(); 
      } 
     }); 
     return false; 
    }); 
}); 

et votre balisage:

<form id="theForm" action="/foo" method="post"> 
    <input name="foo" type="text" /> 
    <input type="submit" value="Go" /> 
</form> 

<div id="someHiddenDiv" style="display: none;">Working...</div> 
4

Ajaxifying la forme n'est pas nécessaire. Vous pouvez simplement afficher un élément div masqué lors de la soumission. Tant que le côté serveur n'a renvoyé aucun bit de la réponse, le navigateur web continuera d'afficher la page initiale.

Vous pouvez utiliser CSS display: none pour masquer initialement un élément. Vous pouvez utiliser jQuery.show() pour afficher le (s) élément (s) correspondant (s) au sélecteur.

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <title>SO question 3377468</title> 
     <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
     <script> 
      $(document).ready(function() { 
       $('#form').submit(function() { 
        $('#progress').show(); 
       }); 
      }); 
     </script> 
     <style> 
      #progress { 
       display: none; 
       color: green; 
      } 
     </style>    
    </head> 
    <body> 
     <form id="form" action="servlet-url" method="post"> 
      ... 
      <input type="submit"> 
     </form> 
     <div id="progress">Please wait...</div> 
    </body> 
</html> 

Donc, aussi longtemps que vous êtes not using scriptlets in JSP pour lancer des trucs d'affaires lourdes, mais plutôt une classe de servlet qui à son tour affiche la JSP à la fin du traitement, ça va fonctionner comme prévu.

Questions connexes