Javascript Girl
  1. Javascript Girl
  3. ASP.Net avec javascript: Utilisation de plusieurs instances d'un contrôle dans un formulaire Web
Intereting Posts
Javascript: tableau plus numéro Segmenter les réponses AJAX dans perl CGI? Ajax affiche le contrôleur ASP.net MVC – les propriétés de l'objet sont nulles Utilisation de Javascript pour ouvrir une nouvelle page et remplacer les valeurs du formulaire là-bas Comment puis-je utiliser return in javascript Curseur sous forme de bande. Bugs in Safari Comment ouvrir un popup et en envoyer un objet JSON Comment lister les fonctions / méthodes d'un objet javascript? (Est-ce même possible?) Ligne courbe sur l'arbre dirigé par force d3 Rails flash avis via ajax Pourquoi l'exécution de JavaScript n'est-elle pas exécutée lorsqu'elle est insérée en réponse à un appel ajax? Pourquoi les performances des opérateurs Web diminuent-elles fortement après 30 secondes? Jquery Ajax – affiche une grande valeur de chaîne Texte fixe dans la zone de texte à l'aide de css et js Javascript / PHP puis-je obtenir une position GPS et m'envoyer?

ASP.Net avec javascript: Utilisation de plusieurs instances d'un contrôle dans un formulaire Web

J'ai un contrôle utilisateur que je veux utiliser plusieurs fois sur une page. J'ai donc essayé l'approche consistant à déplacer le JS de contrôle dans un fichier et à créer un prototype pour qu'il fonctionne correctement sur la page. Mais lors de l'exécution de la solution, il donne l'erreur suivante: Uncaught TypeError: CtrlNameCtrlName1 n'est pas un constructeur

Je ne peux pas trouver où je me trompe. Toute aide serait appréciée.

Merci.

Contrôle utilisateur avec balisage: 

<%@ Control Language="vb" AutoEventWireup="false" CodeBehind="CtrlName.ascx.vb" Inherits="MultiInstanceControl.CtrlName" %> <asp:TextBox ID="txtSearch" runat="server"></asp:TextBox> <br /> <asp:Panel ID="pnlSearch" runat="server" Style="background-color: yellow;width: 30px;height: 30px;"></asp:Panel> <br /> <input id="txtInput" type="text" /> <script type="text/javascript" src="CtrlNameJS.js"></script> <script type="text/javascript"> function CtrlName<%=me.ClientID%>() { this.pnlSearchClientID = <%=pnlSearch.ClientID%>; this.txtSearchClientID = <%=txtSearch.ClientID%>; this.txtInputControl = document.getElementById('txtInput'); this.Category = <%=Category%>; } CtrlName<%=me.ClientID%> = CtrlName.prototype; </script>

Voici le contenu du fichier JS qu'il utilise: 

 function CtrlName() { } CtrlName.prototype = { HidePanel: function () { if (Category == '1') { pnlSearchClientID.style.backGroundColor = 'Red'; } else { pnlSearchClientID.style.backGroundColor = 'Blue'; } }, GetSearchedText: function () { alert($find(txtSearchClientID).get_value()); }, GetInputText: function () { alert(txtInputControl.value); } };

Enfin, la page qui utilise le contrôle ci-dessus avec plusieurs instances: 

 <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="default.aspx.vb" Inherits="MultiInstanceControl._default" %> <%@ Register Src="~/CtrlName.ascx" TagPrefix="uc1" TagName="CtrlName" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title></title> </head> <body> <form id="form1" runat="server"> <div> 1. First Instance <br /><br /> <uc1:CtrlName ID="CtrlName1" IsMultipleFile="false" Category="1" runat="server" /> <asp:Button runat="server" ID="btnTest1" Text="Get Value" OnClientClick="return btnTest_ClientClick('1');" /> <br /><br /> <br /> <br /><br /> <br /><br /> 2. Second Instance <br /><br /> <uc1:CtrlName ID="CtrlName2" IsMultipleFile="false" Category="2" runat="server" /> <asp:Button runat="server" ID="Button2" Text="Get Value" OnClientClick="return btnTest_ClientClick('2');" /> </div> <script type="text/javascript"> var inst1 = new CtrlName<%=CtrlName1.ClientID %>(); var inst2 = new CtrlName<%=CtrlName2.ClientID%>(); function btnTest_ClientClick(strVal) { if (strVal == '1') { inst1.HidePanel(); inst1.GetSearchedText(); inst1.GetInputText(); } else { inst2.HidePanel(); inst2.GetSearchedText(); inst2.GetInputText(); } return false; } </script> </form> </body> </html>

Effectuez les initialisations de variables après que tous les scripts soient chargés comme ceci (avec JQuery): 

 $(document).ready(function()){ var inst1 = new CtrlName<%=CtrlName1.ClientID %>(); var inst2 = new CtrlName<%=CtrlName2.ClientID%>(); function btnTest_ClientClick(strVal) { if (strVal == '1') { inst1.HidePanel(); inst1.GetSearchedText(); inst1.GetInputText(); } else { inst2.HidePanel(); inst2.GetSearchedText(); inst2.GetInputText(); } return false; } };