ASP.NET publication avec JavaScript

Question

J'ai plusieurs petites divs qui utilisant jQuery déplaçable. Ces divs sont placés dans un panneau de mise à jour, et sur dragstop-je utiliser le _doPostBack() fonction JavaScript. où j'ai extrait les informations nécessaires à partir des pages du formulaire.

Mon problème est que lorsque j'appelle cette fonction à l'ensemble de la page est rechargée, mais je ne veux le panneau de mise à jour pour être chargées à nouveau.

Answer 1

Voici une solution complète

Toute forme de tag de la asp.net page

<form id="form1" runat="server">
    <asp:LinkButton ID="LinkButton1" runat="server" /> <%-- included to force __doPostBack javascript function to be rendered --%>

    <input type="button" id="Button45" name="Button45" onclick="javascript:__doPostBack('ButtonA','')" value="clicking this will run ButtonA.Click Event Handler" /><br /><br />
    <input type="button" id="Button46" name="Button46" onclick="javascript:__doPostBack('ButtonB','')" value="clicking this will run ButtonB.Click Event Handler" /><br /><br />

    <asp:Button runat="server" ID="ButtonA" ClientIDMode="Static" Text="ButtonA" /><br /><br />
    <asp:Button runat="server" ID="ButtonB" ClientIDMode="Static" Text="ButtonB" />
</form>

Tout le Contenu de la Page de la Classe Code-Behind

Private Sub ButtonA_Click(sender As Object, e As System.EventArgs) Handles ButtonA.Click
    Response.Write("You ran the ButtonA click event")
End Sub

Private Sub ButtonB_Click(sender As Object, e As System.EventArgs) Handles ButtonB.Click
    Response.Write("You ran the ButtonB click event")
End Sub

• Le LinkButton est inclus afin de s'assurer que l' __doPostBack fonction javascript est rendu au client. Il suffit d'avoir les contrôles de Bouton n'entraînera pas ce __doPostBack fonction d'être rendu. Cette fonction sera rendue en vertu d'avoir une variété de contrôles, sur la plupart des ASP.NET pages, de sorte qu'un vide bouton de lien est généralement pas nécessaire

Ce qui se passe?

Deux contrôles de saisie sont rendus au client:

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />

• __EVENTTARGET reçoit de l'argument 1 de __doPostBack
• __EVENTARGUMENT reçoit argument 2 de l' __doPostBack

L' __doPostBack fonction est rendu comme ceci:

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}

• Comme vous pouvez le voir, il assigne les valeurs de l'caché entrées.

Lorsque le formulaire soumet / publication se produit:

• Si vous avez fourni l'id unique du Serveur-Bouton de Contrôle dont le bouton-cliquez sur gestionnaire que vous souhaitez exécuter (javascript:__doPostBack('ButtonB',''), puis sur le bouton gestionnaire de clic de ce bouton sera exécuté.

Que faire si je ne veux pas lancer un gestionnaire de clic, mais envie de faire autre chose à la place?

Vous pouvez entrer ce que vous voulez comme arguments au __doPostBack

Vous pouvez ensuite analyser les cachés, les valeurs d'entrée et l'exécution de code spécifique en conséquence:

If Request.Form("__EVENTTARGET") = "DoSomethingElse" Then
    Response.Write("Do Something else") 
End If

D'Autres Notes

• Que faire si je ne connais pas l'ID de la commande dont cliquez sur gestionnaire je veux courir?
  • Si il n'est pas acceptable de fixer ClientIDMode="Static", alors vous pouvez faire quelque chose comme ceci: __doPostBack('<%= myclientid.UniqueID %>', '').
  • Ou: __doPostBack('<%= MYBUTTON.UniqueID %>','')
  • Cela permettra d'injecter de l'id unique du contrôle dans le javascript, si vous le souhaitez

Answer 2

Par Phairoh: Utilisez cette option dans la Page de Composant/juste au cas où le panneau de changements de nom

<script type="text/javascript">
     <!--
     //must be global to be called by ExternalInterface
         function JSFunction() {
             __doPostBack('<%= myUpdatePanel.ClientID  %>', '');
         }
     -->
     </script>

Answer 3

Alors que Phairoh la solution semble théoriquement le son, j'ai aussi trouvé une autre solution à ce problème. En passant les UpdatePanels id paramater (cible de l'événement) pour la doPostBack fonction le panneau de mise à jour post sera de retour, mais pas la totalité de la page.

__doPostBack('myUpdatePanelId','')

*remarque: le deuxième paramètre est l'ajout de l'événement args

espérons que cela aide quelqu'un!

EDIT: il semble donc que ce même conseil a été donné ci-dessus comme je l'ai été de frappe :)

Answer 4

Si quelqu'un éprouve de la difficulté avec cela (comme je l'ai été), vous pouvez obtenir la publication de code pour un bouton en ajoutant le UseSubmitBehavior="false" attribut. Si vous examinez le rendu de la source sur le bouton, vous verrez le code javascript que vous devez exécuter. Dans mon cas, il a été en utilisant le nom de la touche plutôt que de l'id.

Answer 5

Avez-vous essayé de passer la mise à Jour du panneau d'identification de client à l' __doPostBack fonction? Mon équipe a fait cela à l'actualisation d'un panneau de mise à jour et autant que je sache, il a travaillé.

__doPostBack(UpdatePanelClientID, '**Some String**');