?
Solved

ModalPopupExtender not working from code behind

Posted on 2014-04-22
7
Medium Priority
?
693 Views
Last Modified: 2014-04-22
Hi all,

I'm trying to invoke a modal popup on a gridview to change user passwords. The modal isn't appearing though? can anyone tell me what I am doing wrong here;

    <asp:HyperLink ID="DummyButton" runat="server" Style="display: none;" />

    <asp:ModalPopupExtender ID="PasswordModalPopupExtender" TargetControlID="DummyButton" PopupControlID="PasswordPopup" runat="server" DropShadow="true" Enabled="true">
    </asp:ModalPopupExtender>
    
    <asp:Panel id="PasswordPopup" runat="server" style="display:none;">
        <asp:ChangePassword ID="ChangePasswordControl" runat="server"></asp:ChangePassword>
    </asp:Panel>

Open in new window


and on the gridview i am capturing the  OnSelectedIndexChanged="OnSelectedIndexChanged"

        ChangePasswordControl.UserName = UserList.SelectedRow.Cells[1].Text;
        FeedbackLabel.Text = "Changing Password for " + UserList.SelectedRow.Cells[1].Text;
        PasswordModalPopupExtender.Show();

Open in new window


now all is firing and the FeedbackLabel is displaying the correct info but the modal doesnt appear?
0
Comment
Question by:flynny
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 3
7 Comments
 
LVL 7

Expert Comment

by:Utkarsh Kulkarni
ID: 40014412
It may be invoking the popup. Just to make sure it get displaying or not, set BackgroundCssClass property.
Also, if it is inside update panel, make sure, both (grid and ModalPopupExtender) should be in same update panel.
0
 

Author Comment

by:flynny
ID: 40014468
Thanks for the reply.

Will not setting the BackgroundCssClass cause issues? Could you suggest what I should put in here for testing?

The modal is not inside anupdate panel and is just in a standard aspx page with a masterpage.
0
 
LVL 7

Expert Comment

by:Utkarsh Kulkarni
ID: 40014521
BackgroundCssClass is an optional attribute. But the css or default setting can do this.
Also, try to access the page in FF & open the Java console to see is there any script error.
Sample CSS

.popup_block{
      display: none; /*--hidden by default--*/
      float: left;
      font-size: 1.2em;
      position: fixed;
      top: 9%; left: 30%;
      z-index: 99999;      
}
.modal_Background
{
      background-color:#CCCCCC;
      filter:alpha(opacity=90);
      opacity:0.9;
      }
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:flynny
ID: 40014638
as far as I can see there are no errors?

    <asp:ModalPopupExtender ID="PasswordModalPopupExtender" TargetControlID="DummyButton" PopupControlID="PasswordPopup" BackgroundCssClass="tmodal_Background" runat="server" DropShadow="true" Enabled="true">
    </asp:ModalPopupExtender>
    
    <asp:Panel id="PasswordPopup" runat="server" CssClass="tpopup_block">
        <asp:ChangePassword ID="ChangePasswordControl" runat="server"></asp:ChangePassword>
    </asp:Panel>

Open in new window


and css is;

.tpopup_block{
      display: none; /*--hidden by default--*/
      float: left;
      font-size: 1.2em;
      position: fixed;
      top: 9%; left: 30%;
      z-index: 99999;      
}
.tmodal_Background
{
      background-color:#CCCCCC;
      filter:alpha(opacity=90);
      opacity:0.9;
      } 

Open in new window


if I user firebug I can drill down and see the panel is being rendered?

any idea?
0
 
LVL 7

Expert Comment

by:Utkarsh Kulkarni
ID: 40014732
You can check using firebug.
What AjaxControl Toolkit version are you using ?
0
 
LVL 7

Accepted Solution

by:
Utkarsh Kulkarni earned 2000 total points
ID: 40014763
Hi,

here is the sample code
 <style>
            .tpopup_block {
                display: none; /*--hidden by default--*/
                float: left;
                font-size: 1.2em;
                position: fixed;
                top: 20%;
                left: 30%;
                z-index: 99999;
                color: #ff0000;
            }

            .tpopup_block_click {
                float: left;
                font-size: 1.2em;
                position: fixed;
                top: 20%;
                left: 30%;
                z-index: 99999;
                color: #ff0000;
            }

            .tmodal_Background {
                background-color: #CCCCCC;
                filter: alpha(opacity=90);
                opacity: 0.9;
            }
        </style>
        <div>
            <asp:ScriptManager runat="server" ID="sm"></asp:ScriptManager>
            <asp:Button ID="bbb" runat="server" OnClick="bbb_Click" Text="Test" />
            <asp:HyperLink ID="DummyButton" runat="server" Style="display: none;" />
            <cc1:ModalPopupExtender ID="PasswordModalPopupExtender" TargetControlID="DummyButton" PopupControlID="PasswordPopup" BackgroundCssClass="tmodal_Background" runat="server" DropShadow="true" Enabled="true">
            </cc1:ModalPopupExtender>
            <asp:Panel ID="PasswordPopup" runat="server" CssClass="tpopup_block">
                <h1>Sample Text</h1>
            </asp:Panel>
        </div>

Open in new window


protected void bbb_Click(object sender, EventArgs e)
        {
            PasswordPopup.CssClass = "tpopup_block_click";
            PasswordModalPopupExtender.Show();
        }

Open in new window


Check this on single page first & then modify for Master Page / Content place holder
0
 

Author Comment

by:flynny
ID: 40014829
hi there.

this still was not working. So as I am really only showing this from the server side I have just removed the popupcontrol and set a panel to be visible=true on the click.

this works well and removes the bloated popupextender control.

thanks for all the help though.
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
This tutorial will teach you the special effect of super speed similar to the fictional character Wally West aka "The Flash" After Shake : http://www.videocopilot.net/presets/after_shake/ All lightning effects with instructions : http://www.mediaf…
Visualize your data even better in Access queries. Given a date and a value, this lesson shows how to compare that value with the previous value, calculate the difference, and display a circle if the value is the same, an up triangle if it increased…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question