Boîte de dialogue de réinitialisation jQuery sur l'annulation et la fermeture avant la publication du formulaire

J'ai un code qui ouvre une boîte de dialogue, valide et affiche un formulaire lorsque la validation est réussie.Boîte de dialogue de réinitialisation jQuery sur l'annulation et la fermeture avant la publication du formulaire

Si l'utilisateur clique sur "Annuler", la boîte de dialogue doit être réinitialisée jusqu'à la prochaine fois qu'elle est appelée.

Si l'utilisateur clique sur "OK", la boîte de dialogue doit se fermer et le formulaire doit être affiché, donc si j'appuie sur le bouton de retour, la boîte de dialogue n'apparaît pas sur la page.

code est le suivant:

<script>  
$(function(){//document ready 
     $("#dialog").dialog({ 
     autoOpen: false, 
     modal: true 
    }); 


    $("#confirmLink").click(function(e) { 

    e.preventDefault(); 
    var targetUrl = $(this).attr("href"); 


    $("#dialog").dialog(

    { minWidth: 500 },{ 
     buttons : { 

     "Ok": function() { 

      $('#flagform').submit(); 


      //window.location.href="modalReceipt.asp?documentGUID="+$("#documentGUID").val()+"&fycuserid="+$("#fycuserid").val()+"&reason=" + $("#reason").val()+"&other="+ $("#other").val() 
      }, 
     "Cancel" : function() { 
      $(this).dialog("close"); 
     } 
     }, 
     open: function() { 

    jQuery.validator.messages.required = ""; 

     $("#flagform").validate({ 
     invalidHandler: function(e, validator) { 
      var errors = validator.numberOfInvalids(); 
      if (errors) { 
       var message = errors == 1 
        ? 'You missed 1 field. It has been highlighted below' 
        : 'You missed ' + errors + ' fields. They have been highlighted below'; 
       $("div.error span").html(message); 
       $("div.error").show(); 
      } else { 
       $("div.error").hide(); 
      } 
     }, 
     // the errorPlacement has to take the table layout into account 

     messages: { 
      reason: "*", 
      explanation: "*" 
      }, 
    });//validate 

     }, 

    }); 




    $("#dialog").dialog("open"); 
    }); 
    }); 
</script> 

</head> 
<body> 
    <a class="normal" id="confirmLink" href="">Test</a> 
     <div id="dialog" title="Flag This Document" style="display:none"> 
      <form id="flagform" action="modalReceipt.asp" method="post"> 
     Please choose a reason for flagging this document and provide an explanation, if necessary. 
    <p><p><div class="error" style="display:none;color:red">  <span></span>.<br clear="all"/> 
</div> 
<table class="emptygrid"> 
<tr> 
<td class="header">Reason:</td> 
<td class="data"> 
    <select name="reason" id="reason" class="required"> 
     <option value="">-- Choose a Reason --</option> 
     <option value="plagiarism">Plagiarism</option> 
     <option value="submissionError">Submission Error</option> 
     <option value="instructions">Student Didn't Follow Instructions</option> 
     <option value="blankDocument">Blank Document</option> 
     <option value="other">Other (please explain)</option> 
     </select> 


     </td> 
     <td class="status"></td> 

</tr> 
<tr> 
<td class="header" style="vertical-align:top">Explanation:</td> 
<td class="data"> <textarea name="explanation" rows="10" cols="35"></textarea></td><td class="status"></td> 

</tr> 


</table> 
<input type="hidden" id="fycuserid" name="fycuserid" value="33"/> 
<input type="hidden" id="documentGUID" name="documentGUID" value="26219247-EB85-4ABD-8F74-C8448BA06472"/> 

</form> 
</div>

Source

2010-09-22 Caveatrob

Si l'utilisateur clique sur « Annuler », la boîte de dialogue devrait réinitialiser jusqu'à la prochaine fois qu'il est appelé.

modifier votre « Annuler » à quelque chose comme ça,

"Cancel": function() { 
    $(this).dialog("close"); 
    $(this).find('form')[0].reset(); 
}

Si l'utilisateur clique sur « OK », la boîte de dialogue devrait se fermer et la forme doit poster, donc si je frappe le bouton de retour la boîte de dialogue n'apparaît pas sur la page.

Je vous suggère de le faire côté serveur. Lorsque l'envoi est réussi, effectuez un cookie ou des variables de session. Vérifiez cette variable lorsque la page est chargée et faites quelque chose pour que la boîte de dialogue apparaisse ou n'apparaisse pas dans la page.

Source

2010-09-22 01:48:11 Reigel

Serait-il utile de définir le contenu ... expire sur la page afin qu'ils ne puissent pas revenir en arrière? – Caveatrob

Que faire si le document a plusieurs formulaires? Puis-je trouver ('# formname'). Reset(); ? – Caveatrob

si c'est dans la boîte de dialogue, oui vous pouvez ... – Reigel

Boîte de dialogue de réinitialisation jQuery sur l'annulation et la fermeture avant la publication du formulaire

Répondre

Questions connexes