2010-03-11 4 views
5

J'essaie d'arrêter la publication sur un formulaire si ma validation jQuery personnalisée renvoie false.Prévenir ASP.net __doPostback() de jQuery submit() dans UpdatePanel

Est-il possible d'empêcher la fin de la fonction __doPostback() dans la fonction submit()?

J'avait supposé:

$('#aspnetForm').submit(function() { return false; }); 

ferait l'affaire, mais apparemment ce n'est pas le cas: Quelqu'un at-il une suggestion? La fonction submit() bloque la publication (elle ne sera pas postback si vous faites une pause à un point d'arrêt dans firebug), mais je n'arrive pas à arrêter l'événement après la fin de la fonction submit()!

Cheers, Ed

EDIT

OK, j'ai eu un désordre rapide au sujet et a découvert que le fait que le bouton que je utilise pour provoquer la postback est liée à un UpdatePanel comme AsyncPostBackTrigger semble être le problème: Si je l'enlève comme un déclencheur (c.-à-d. le faire produire une publication complète), il n'y a aucun problème pour empêcher la publication avec return false;

Des idées pour lesquelles la publication asynchrone ne serait pas stoppable avec return false?

Répondre

5

Vous devez utiliser le côté client PageRequestManager pour gérer correctement les événements de soumission AJAX. (Par exemple, empêcher un postback asynchrone.)

Si vous n'avez pas le contrôle total de la page, il peut y avoir JavaScript sur la page qui appelle simplement __doPostBack() sans passer par une quelconque logique de page. Dans ce cas - en plus de ce qui précède -, vous devez stocker l'ancien window.__doPostBack() et fournir le vôtre - comme @tucaz mentionné dans ses commentaires. (... et comme vous l'avez mentionné, le chaînage peut être assez compliqué.) Pour les soumissions régulières (non-AJAX), vous pouvez fournir un gestionnaire d'événements comme d'autres l'ont indiqué.

This page peut être d'aide et a des exemples de code qui utilisent PageRequestManager. En particulier:

initialize : function() 
{ 
    ... 

    this._onSubmitHandler = Function.createDelegate(this, this._onSubmit); 
    this._onPartialUpdateEnd = Function.createDelegate(this, this._onUpdateEnd); 

    if (typeof(Sys.WebForms)!== "undefined" && typeof(Sys.WebForms.PageRequestManager)!== "undefined") 
    { 
     Array.add(Sys.WebForms.PageRequestManager.getInstance()._onSubmitStatements, this._onSubmitHandler); 
     Sys.WebForms.PageRequestManager.getInstance().add_endRequest(this._onPartialUpdateEnd); 
    } 
    else 
     $addHandler(document.forms[0], "submit", this._onSubmitHandler); 
}, 

Modifier: Après ce qui précède, cela, par exemple fonctionne très bien pour moi (.Net 3.5 SP1, Button1 est déclencheur dans le UpdatePanel, etc ...):

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 

    <script src="http://ajax.microsoft.com/ajax/jQuery/jquery-1.4.2.js" charset="utf-8" 
     type="text/javascript"></script> 

</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:ScriptManager ID="ScriptManager1" runat="server"> 
    </asp:ScriptManager> 
    <asp:UpdatePanel ID="UpdatePanel1" runat="server"> 
     <ContentTemplate> 
      <div> 
       <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" /> 
      </div> 
     </ContentTemplate> 
     <Triggers> 
      <asp:AsyncPostBackTrigger ControlID="Button1" /> 
     </Triggers> 
    </asp:UpdatePanel> 
    </form> 
    <script type="text/javascript"> 
     (function($, undefined) { 

      var submitHandler = function(e) { 
       return false; 
      } 

      if (typeof (Sys.WebForms) !== "undefined" && typeof (Sys.WebForms.PageRequestManager) !== "undefined") { 
       Array.add(Sys.WebForms.PageRequestManager.getInstance()._onSubmitStatements, submitHandler); 
      } else { 
       $("form").submit(submitHandler); 
      } 
     })(jQuery); 
    </script> 
</body> 
</html> 
+0

Oui, j'ai traversé les documents UpdatePanel et il semble que vous pouvez annuler publications asynchrones avec PageRequestManager.getInstance(). abortPostBack(). Cependant, il semble que cela ne fonctionne pas correctement: mon gestionnaire submit() ne bloque plus la publication. –

+0

@Ed Woodcock: En regardant la source et l'article trouvé par ex. Sur http://msdn.microsoft.com/fr-fr/magazine/cc163380.aspx, abortPostBack() permet d'annuler une demande * déjà démarrée *. –

3
$('#yourPostButton').click(function(){ 
    return false; 
}); 

Cela devrait faire!

+0

@tucaz, j'espère que cela ne vous dérange pas d'éditer votre réponse. – rahul

+1

Oui, mais alors je devrais attacher cela à chaque bouton sur le formulaire, ce qui n'est pas très raisonnable. Je dois être capable de le faire avec submit() (ou un équivalent) afin que je puisse utiliser le contrôle qui utilise le code sans avoir à le configurer sur une base de page. –

+0

Si ce n'est pas un problème pour vous, vous pouvez l'ajouter à chaque bouton avec $ ('input [type = button]') ou quelque chose comme ça ou essayez le .preventDefault() comme suggéré par la documentation jQuery ici http: // api. jquery.com/submit/ – tucaz