none
Mon popup disparait au déclenchement de l'evenement ontextChanged de mon textbox RRS feed

  • Question

  • Bonjour tout le monde

    Voilas j'ai un popup sur lequel se trouve un textbox. Pour que l'evenement ontextChanged de mon texboss se déclenche j'ai mis sa propriété autopostback a true.

    une fois que l'évenement se déclenche le popup disparait.

    j'aimerais savoir s'il ya une autre manière de pourvoir déclencher l'evenement ontextboxChanged sans mettre la propriété autopostback a true; parceque ce que j'ai pu remarquer c'est cette propriété a true qui fait disparaitre mon popup. A moins que je me trompe.

    Merci d'avance...


    koko

    mercredi 9 juillet 2014 17:09

Réponses

  • Bonjour, 

    Avez-vous tenté la deuxième solution que je vous avais proposé : 

    - Forcer l'affichage de la popup après le postback. 

    Ci dessous un exemple :

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajaxToolkit:ToolkitScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Button ID="Button1" runat="server" Text="Open popup" />
                    <asp:Panel ID="Panel1" runat="server" BackColor="Red">
                        <asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged" AutoPostBack="true"></asp:TextBox>
                    </asp:Panel>
                    <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" PopupControlID="Panel1" runat="server" TargetControlID="Button1" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </form>
    </body>
    </html>
    

    Et le C# : 

    using System;
    using System.Collections.Generic;
    using System.Diagnostics;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace WebApplication1
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void TextBox1_TextChanged(object sender, EventArgs e)
            {
                Debug.WriteLine(TextBox1.Text);
                ModalPopupExtender1.Show();
            }
        }
    }

    Cordialement, 


    Kevin BEAUGRAND, Modis FRANCE
    Merci de bien vouloir "Marquer comme réponse", les réponses qui ont résolu votre problème.

    mardi 22 juillet 2014 08:22

Toutes les réponses

  • Bonjour,

    M'étonnerait que tu te trompes, le postback réaffiche la page principale, donc sauf à réeffectuer l'action qui a affiché le popup ça le fait disparaître.

    Si tu veux réagir à la modification du texte il semble a priori plus approprié de le faire du côté client, sauf si tu as besoin d'une table distante auquel cas il faudra chercher du côté d'Ajax.

    Du côté client, tu écriras, a priori, un script en Javascript, à moins que tu préfères VBScript.

    Le TextBox est rendu sur la page par un contrôle <input type="text">, donc tu trouveras une documentation à propos de ce contrôle client là : http://www.w3schools.com/tags/tag_input.asp

    Maintenant, ce que tu cherches, c'est les événements supportés. donc en bas de la page tu trouves un lien Event Attributes in Html ou quelque chose du style, qui te mène là :

    http://www.w3schools.com/tags/ref_eventattributes.asp

    Attention c'est tout en Anglais, j'espère que ça ne va pas trop de désorienter, car il va falloir essayer plusieurs événements pour voir celui qui donne satisfaction. Je suggérerais bien de tester onchange, en premier. Si ça ne va pas tu peux tester avec les événements du clavier.

    Je te conseille fortement de créer une page locale dans le but de tester les scripts côté client, tu peux partir de la page de ton site que tu sauvegarderas par "fichier, enregistrer sous", et stocker ça dans un répertoire temporaire, comme ça tu l'effaceras une fois que tu auras intégé les scripts sur ton site.

    Tu peux affecter la propriété onchange, si c'est cet événement que tu retiens, au contrôle asp:TextBox. L'intellisense ne va pas le reconnaître, et à la compilation (enfin ... la génération du site), la fenêtre des erreurs va te signaler que cette propriété est inconnue, mais elle sera bien transmise au contrôle input de rendu, donc côté client ça va fonctionner.

    Là, tu as un exemple simple, car l'événement est transmis au contrôle de rendu directement. Dans le cas de certaines listes tu as plusieurs contrôles imbriqués pour le rendu, et la propriété est transmise à celui qui en encapsule plusieurs, qui peut être <td>, ou <span>. Pour détecter un mouvement de souris là-dessus, bon courage. Dans ce cas il te faut donc activer la trace (trace="true" dans la balise d'ouverture sur le fichier aspx) le temps de regarder la liste des contrôles pour voir comment s'appelle exactement, du côté client, celui qui t'intéresse. Ensuite, dans l'événement d'ouverture de la page (fonction javascript que tu affectes à la propriété onload de la balise body), tu peux ajouter une propriété au contrôle qui t'intéresse.

    Je te laisse chercher la balise body, tenir compte du cas où elle est définie dans une page maîtresse, et lui affecter un script que tu vas placer non pas dans le code-behind mais dans la balise scripts, dans la partie head de ton document html. Ne t'encombre pas trop du paragraphe précédent tant que c'est un textbox que tu as à gérer.

    Il se peut bien que tu aies à assimiler quelques notions concernant les scripts sur une page web, comme par exemple le fait de devoir intégrer la balise scripts entre des signaux du style

        <script type="text/javascript" language="javascript">
    //<![CDATA[

    au début, et

    //]]>
        </script>


    à la fin, ce qui évite que les scripts soient affichés, puisque ce n'est pas le but.

    Bon courage.

    http://www.toutjavascript.com/main/index.php3

    • Modifié Gloops samedi 19 juillet 2014 15:25
    samedi 19 juillet 2014 15:20
  • J'ai sorti ça vite fait. Si c'est indigeste il faudra que j'y passe plus de temps.

    Notamment il faudra que je sache sur lesquels de ces sujets tu es déjà à l'aise :

    - structure d'un fichier HTML

    - intégration d'un script à une page HTML

    - Javasript (ou VBScript)

    - ASP et la génération d'une page HTML.

    • Modifié Gloops samedi 19 juillet 2014 15:41
    samedi 19 juillet 2014 15:35
  • Bonjour,

    Effectivement, comme le dit gloops, un postback a pour effet de faire reafficher la page a 0.

    Concernant les solutions "simples", je peux vous conseiller l'une des actions suivantes :

    - lors du rechargement de la page (page_load), refaire afficher la popup.

    - utiliser un updatepanel dans votre popup.

    Personnellement, je préfère l'utilisation de l'update panel qui aura pour effet de ne pas recharger toute la page mais uniquement le panel en cours. Et donc la popup restera ouverte.

    Cordialement,


    Kevin BEAUGRAND, Modis FRANCE
    Merci de bien vouloir "Marquer comme réponse", les réponses qui ont résolu votre problème.

    dimanche 20 juillet 2014 14:09
  • Bonjour merci pour votre reponse.

    j'utilise un updatepanel sur lequel j'ai déposé mon popup pour empêcher, comme l'a dit Kevin, pour empecher le chargement de toute ma page; mais le popup disparait.

    Je me suis penché sur le javascript. Pour le moment j'ai pas grand chose

    Ce que je voulais faire c'est que je veux que le texbos sur mon popup m'affiche le montant d'un produit à sa prise de focus et ce montant est calculer à partir du Prix unitaire d'un produit que je dois récupérer depuis ma base des donnée.

    J'essaie de créer une fonction JavaScript que je vais appeler au déclenchement l’événement onfocus de mon textbos. mais le truc est que je dois parcourir une liste d'objet que j'ai crée depuis mon code behind. Je ne sais pas comment m'y prendre.

    Je vais voir du coté ajax et je vous informe.


    koko

    lundi 21 juillet 2014 16:24
  • Bonjour, 

    Avez-vous tenté la deuxième solution que je vous avais proposé : 

    - Forcer l'affichage de la popup après le postback. 

    Ci dessous un exemple :

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></ajaxToolkit:ToolkitScriptManager>
            <asp:UpdatePanel ID="UpdatePanel1" runat="server">
                <ContentTemplate>
                    <asp:Button ID="Button1" runat="server" Text="Open popup" />
                    <asp:Panel ID="Panel1" runat="server" BackColor="Red">
                        <asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged" AutoPostBack="true"></asp:TextBox>
                    </asp:Panel>
                    <ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" PopupControlID="Panel1" runat="server" TargetControlID="Button1" />
                </ContentTemplate>
            </asp:UpdatePanel>
        </form>
    </body>
    </html>
    

    Et le C# : 

    using System;
    using System.Collections.Generic;
    using System.Diagnostics;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    
    namespace WebApplication1
    {
        public partial class WebForm1 : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void TextBox1_TextChanged(object sender, EventArgs e)
            {
                Debug.WriteLine(TextBox1.Text);
                ModalPopupExtender1.Show();
            }
        }
    }

    Cordialement, 


    Kevin BEAUGRAND, Modis FRANCE
    Merci de bien vouloir "Marquer comme réponse", les réponses qui ont résolu votre problème.

    mardi 22 juillet 2014 08:22
  • Bonjour,

    Peut-être un point à ne pas perdre de vue : OnTextChanged, c'est du côté serveur. C'est donc un code qui sera exécuté lors du postback. ça peut être une solution, en ne négligeant pas de mettre un bouton pour déclencher la mise à jour du popup.

    Il me semble aussi que l'UpdatePanel peut beaucoup simplifier la vie du programmeur quand il s'agit d'afficher des informations en fonction de la variation d'un champ. Mais quand on a dit ça, on n'a pas expliqué le fonctionnement de l'UpdatePanel.

    Je suggèrerais bien, ne serait-ce qu'à titre de curiosité, de temporiser sur la question du pop-up (ne pas en mettre pour le moment, rapatrier les informations quelque part sur la page, dans un UpdatePanel), et de procéder dans cet ordre :

    1. Lire attentivement la doc de l'UpdatePanel, il peut y avoir plusieurs pages ; si des exercices sont proposés, les faire (il y avait un atelier là-dessus dans le coach en ligne, mais aux dernières nouvelles le coach n'était plus en ligne)
    2. Composer la page avec un UpdatePanel qui mette à jour les informations voulues lorsque la sélection est modifiée (la sélection ne gagnerait-elle pas à être faite avec une liste d'ailleurs, mais là peut-être que j'embrouille ...)
    3. Une fois qu'on est satisfait du résultat avec l'UpdatePanel, alors se poser la question de comment remettre un pop-up ; certains utilisateurs bloquent les popups d'ailleurs, donc il faut les informer de ce qu'ils vont y trouver.

    mardi 22 juillet 2014 08:46
  • Bonjour. excusez moi pour le retour tardif.

    J'ai utilisé l'updatepanel. Mais tjrs la meme chose

    voici mon code: j'ai mis mon popup dans un updatepanel qui se trouve lui meme dans un autre update que j'ai pas mis ici dans le code

    <asp:UpdatePanel ID="updatePanelPrix" runat="server">
                <ContentTemplate>
                    <asp:Panel ID="panelPrix" runat="server" CssClass="popupPanelZoneEssentielle" Width="750px">
                        <div class="boldMinTitle">
                            Saisie des Prix</div>
                        <hr class="separateurFiltreDonnees" />
                        <div>
                            <div>
                                <table style="width: 80%; margin: auto; margin-bottom: 10px;">
                                    <tr>
                                        <td>
                                            <asp:Repeater ID="repeaterPrix" runat="server">
                                                <HeaderTemplate>
                                                    <table cellpadding="0" cellspacing="5">
                                                        <%--<tr style="padding-">
                                                        <td colspan="6">
                                                            <asp:Label ID="lblInstructions" runat="server" Text="Liste des produits à traiter" />
                                                        </td>
                                                    </tr>--%>
                                                        <tr runat="server" id="trHeader" style="font-weight: bold;">
                                                            <td style="font-family: Andalus">
                                                                Produit
                                                            </td>
                                                            <td style="font-family: Andalus">
                                                                Coût
                                                            </td>
                                                            <td style="font-family: Andalus">
                                                                Prix Unitaire
                                                            </td>
                                                            <td>
                                                            </td>
                                                            <td>
                                                            </td>
                                                            <td>
                                                            </td>
                                                        </tr>
                                                </HeaderTemplate>
                                                <ItemTemplate>
                                                    <tr>
                                                        <td>
                                                            <asp:Label ID="lblNomProd" runat="server" Text='<%#Eval("amLibelleProd")%>' Width="175px"></asp:Label>
                                                        </td>
                                                        <td>
                                                            <asp:TextBox ID="txtCout" runat="server" Width="90" Text='<%#Eval("amCout")%>' CssClass="txtPanel" OnTextChanged ="calculerPrixUnitaire" />
                                                        </td>
                                                        <td>
                                                            <asp:TextBox ID="txtPU" runat="server" Width="90" Text='<%#Eval("amPu")%>' CssClass="txtPanel" />
                                                        </td>
                                                        <td>
                                                            <asp:Label ID="lblCodeProd" runat="server" Text='<%#Eval("amCodeProd")%>' Visible="False"></asp:Label>
                                                        </td>
                                                    </tr>
                                                </ItemTemplate>
                                                <FooterTemplate>
                                                    <%--<tr style="padding-">
                                                    <td colspan="6">
                                                        <asp:Button ID="btnAdd" runat="server" Text="Add" CommandName="Add" OnClick="saveRecord" />
                                                    </td>
                                                </tr>
                                                </table>--%>
                                                </FooterTemplate>
                                            </asp:Repeater>
                                        </td>
                                        <td>
                                        </td>
                                    </tr>
                                </table>
                            </div>
                            <div style="vertical-align: middle; text-align: center">
                                <asp:Label ID="lblProdDejasAjouter" runat="server" Text="Label" ForeColor="#CC0000"
                                    Visible="False"></asp:Label>
                            </div>
                            <div>
                                <table>
                                    <tr>
                                        <td>
                                            <asp:Button ID="btnValider" runat="server" CssClass="bouton" Text="Valider" Width="100px"
                                                OnClick="enregistrerPrix" />
                                        </td>
                                        <td>
                                            <asp:Button ID="Button1" runat="server" CssClass="bouton" Text="Cancel" Width="100px" />
                                        </td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </asp:Panel>
                    <asp:LinkButton ID="LinkButton1" runat="server"></asp:LinkButton>
                    <asp:ModalPopupExtender ID="AfficheurPrix" runat="server" TargetControlID="LinkButton1"
                        PopupControlID="panelPrix" OkControlID="Button1" BackgroundCssClass="modalPopUp"
                        DropShadow="true">
                    </asp:ModalPopupExtender>
                </ContentTemplate>
            </asp:UpdatePanel>
    Protected Sub calculerPrixUnitaire()
            For Each item As RepeaterItem In repeaterPrix.Items
                For Each v_IndiceProd As Produit In v_ListeProduitAsaisir
                    If DirectCast(item.FindControl("lblCodeProd"), Label).Text = v_IndiceProd.amCodeProd.ToString().Trim() Then
                        DirectCast(item.FindControl("txtPU"), TextBox).Text = Val(DirectCast(item.FindControl("txtCout"), TextBox).Text) / v_IndiceProd.amContenance
                    End If
                Next
            Next
        End Sub



    koko


    mercredi 23 juillet 2014 16:03
  • Bonjour,

    Avez-vous testé l'autre solution proposé dans mon poste ci-dessus ?

    Cordialement,


    Kevin BEAUGRAND, Modis FRANCE
    Merci de bien vouloir "Marquer comme réponse", les réponses qui ont résolu votre problème.

    mercredi 23 juillet 2014 16:18
  • bonjour

    Excuse moi Kevin ,  j'avais pas lu totalement ta proposition.

    ça a résolu mon problème.

    Merci.

    Également merci a toi Gloops. j'ai découvert beaucoup grâce à tes liens.


    koko


    jeudi 24 juillet 2014 11:19