web-dev-qa-db-fra.com

ASP.NET: ModalPopupExtender Empêche le bouton Cliquez sur l'événement du tir

Voici ce que j'essaie de faire: cliquez sur un bouton sur ma page, qui fait à son tour (2) les choses se produisent:

  1. Afficher un ModalPopup pour empêcher l'utilisateur d'appuyer sur les boutons ou la modification des valeurs
  2. Appelez mon code derrière la méthode, masquant le modalPopup lorsque vous avez terminé

Voici le ASP MARKUP:

<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true"
    UpdateMode="Always">
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" />
    </Triggers>
    <ContentTemplate>
        <asp:Panel ID="pnlHidden" runat="server" style="display: none;">
            <div>
            <h1>Saving...</h1>
            </div>
        </asp:Panel>
        <cc1:ModalPopupExtender ID="modalPopup"
            BackgroundCssClass="modalBackground" runat="server"
            TargetControlID="btnSaveData" PopupControlID="pnlHidden"
            BehaviorID="ShowModal">
        </cc1:ModalPopupExtender>
        <asp:Button ID="btnSaveData" runat="server" Text="Save Data"
            OnClick="btnSaveData_Click" />
    </ContentTemplate>
</asp:UpdatePanel>

Maintenant, voici mon code derrière C # code:

protected void btnSaveData_Click(object sender, EventArgs e)
{
   UpdateUserData(GetLoggedInUser());
   modalPopup.Enabled = false;
}

Pourquoi pas ce travail? Le modalPopup s'affiche parfaitement, mais l'événement BTNSaveData_Click ne tire jamais.

Mise à jour : La première suggestion n'a pas fonctionné pour moi. J'ai aussi essayé votre deuxième suggestion (dans la mesure où elle m'a appliqué). Une différence mineure sur ma fin est qu'il n'y a pas de bouton sur mon panneau modal (PnlChidden) - c'est juste un message. J'ai essayé d'utiliser des événements JavaScript sur le côté du client, qui a au moins le feu simultanément avec mon événement côté serveur. C'était une bonne nouvelle, mais je ne peux pas sembler trouver ou attraper une poignée sur le modalpopupUntender ou son comportemental. Cela ne fonctionne pas:

function showOverlay() {
    var popup = $find('modalPopup');
    popup.show();
}

pop-up est toujours égal à zéro.

Mise à jour finale : C'est ma solution finale pour que cela fonctionne (prenez une note spécifique de l'utilisation de OnClientClick et OnClick):

<asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="true"
UpdateMode="Always">
<Triggers>
    <asp:AsyncPostBackTrigger ControlID="btnSaveData" EventName="Click" />
</Triggers>
<ContentTemplate>
    <asp:Panel ID="pnlHidden" runat="server" style="display: none;">
        <div>
        <h1>Saving...</h1>
        </div>
    </asp:Panel>
    <cc1:ModalPopupExtender ID="modalPopup"
        BackgroundCssClass="modalBackground" runat="server"
        TargetControlID="hdnField" PopupControlID="pnlHidden"
        BehaviorID="ShowModal">
    <asp:HiddenField ID="hdnField" runat="server" />
    </cc1:ModalPopupExtender>
    <asp:Button ID="btnSaveData" runat="server" Text="Save Data"
        OnClientClick="showModal();" OnClick="btnSaveData_Click" />
    </ContentTemplate>
</asp:UpdatePanel>

Utilisation de cette fonction JavaScript:

function showModal() { $find('ShowModal').show(); }

... et ce code derrière:

protected void btnSaveData_Click(object sender, EventArgs e)
{
   UpdateUserData(GetLoggedInUser());
   modalPopup.hide();
}
c#asp.netajaxmodalpopupextender
15
C. Griffin

Essaye ça.

Créer un champ mannequin caché:

<asp:HiddenField ID="hdnField" runat="server" />

Définissez la cibleControlid = "HDNFIELD" dans votre déclaration de popup modale.

Dans votre événement BTNSAVEDATA_CLICK, faites ceci:

modalPopup.Show();
15
Jack Marchetti

Essaye ça. Il est de 100% de travail

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>
        <asp:Button ID="Btnshow" runat="server" Text="Show" OnClick="Btnshow_Click" />
        <asp:Button ID="BtnTarget" runat="server" Text="Target" Style="display: none" />
        <asp:TextBox ID="TextBox1" runat="server">
        </asp:TextBox>
        <input type="button" value="Get" onclick="abc()" />
        <asp:ModalPopupExtender ID="ModalPopupExtender1" runat="server" TargetControlID="BtnTarget"
            PopupControlID="Panel1">
        </asp:ModalPopupExtender>
        <asp:Panel ID="Panel1" runat="server" BackColor="Black" Width="300px" Height="300px">
            <asp:UpdatePanel ID="UpdatePanel2" runat="server" ChildrenAsTriggers="false" UpdateMode="Conditional">
                <ContentTemplate>
                    <asp:Button ID="BtnHide" runat="server" Text="Hide Button" OnClick="BtnHide_Click" />
                </ContentTemplate>
                <Triggers>
                    <asp:AsyncPostBackTrigger ControlID="BtnHide" EventName="Click" />
                </Triggers>
            </asp:UpdatePanel>
        </asp:Panel>
    </ContentTemplate>
    <Triggers>
        <asp:AsyncPostBackTrigger ControlID="Btnshow" EventName="Click" />
    </Triggers>
</asp:UpdatePanel>

Code côté serveur

protected void Btnshow_Click(object sender, EventArgs e)
{
    ModalPopupExtender1.Show();
}
protected void BtnHide_Click(object sender, EventArgs e)
{
    ModalPopupExtender1.Hide();
}
3
Shaikh Sohail

À partir de cet exemple, vous pouvez facilement contrôler le panneau Afficher dépend des conditions au lieu de simplement présenter immédiatement un panneau une fois que vous cliquez sur le bouton.

<asp:Button ID="btnAdd" runat="server" OnClick="btnAdd_Click"/>
<asp:HiddenField ID="hdnField" runat="server" />
<ajaxToolkit:ModalPopupExtender runat="server" 
  TargetControlID="hdnField" 
  ID="btnAdd_ModalPopupExtender"
  PopupControlID="pnlPrintName">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="pnlPrintName" runat="server">
.
.
</asp:Panel>

//Server side code:
protected void btnAdd_Click(object sender, EventArgs e)
{
  if( dt.Rows.Count == 0 )
  {
     btnAdd_ModalPopupExtender.Show();
  }
  else
  {
     add();
  }
}
1
Lisa

Première tentative: essayez de définir votre buttonid dans OkControlid Tag et essayez à nouveau

OR

Deuxième tentative: appelez votre événement sur JavaScript, il semble y avoir des problèmes avec des événements click

<div> 
    <cc1:ModalPopupExtender PopupControlID="Panel1"  
         ID="ModalPopupExtender1" 
         runat="server" TargetControlID="LinkButton1" OkControlID="Ok"  
         OnOkScript="__doPostBack('Ok','')"> 
    </cc1:ModalPopupExtender> 
    <asp:LinkButton ID="LinkButton1" runat="server">LinkButton</asp:LinkButton>  
</div>         

<asp:Panel ID="Panel1" runat="server"> 
    <asp:Button ID="Ok" runat="server" Text="Ok" onclick="Ok_Click" />             
</asp:Panel>
1
MUG4N

En code derrière, vous pouvez le faire:

if (true)
{
    var script = @"Sys.Application.add_load(function() { $find('behavoirIDModal').show(); });";
    ScriptManager.RegisterStartupScript(this, GetType(), "Show", script, true);
}

Changer ce 'comportementOiridModal'

1
Diego Venâncio