update panel not working - c#

This used to work and now for some reason it doesn't.

I have an update panel that is controlled by an ajax modal popup extender. When the user hits the create button the panel just freezes. The create button is supposed to add an album to the database.

Here I will post the front end and the button click.

Thanks for the help.
<%@ Page Language="C#" viewStateEncryptionMode="Never" MasterPageFile="~/HomeMasterPage.master" enableEventValidation="false"  AutoEventWireup="true" CodeFile="MyPictures.aspx.cs" Inherits="MyPictures" Title="My Pictures" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="ajaxToolKit" %>
 
<asp:Content ID="HeadEntries" ContentPlaceHolderID="HeadEntries" runat="server">
    <link rel="stylesheet" type="text/css" href="~/style.css" />
    <script language="JavaScript" type="text/javascript">
		var vert = (screen.availWidth/2)-420;
	    var horz = (screen.availHeight/2)-500;
 
        function popUp(pageurl,name) {
            window.open(pageurl,name,"width=410,height=370,resizable=yes,scrollbars=no,screenX="+vert+",screenY="+horz+",z-lock=no");
        }
    </script>
</asp:Content>
<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
    <asp:MultiView ID="MultiView1" runat="server">
        <asp:View ID="UploadPictures" runat="server">
                <h1>
                    &nbsp; &nbsp; Upload Pictures</h1>
                <table style="width: 80%">
                    <tr>
                        <td align="center" colspan="2">
                        <asp:Panel ID="Panel1" runat="server" Height="20px" Width="100%" style="position: relative; z-index: 100; left: 0px; top: 8px;" BorderColor="Transparent">
                            <asp:Label ID="Label2" runat="server" Text="Upload Pictures" EnableTheming="True" Font-Bold="False" Height="22px" Width="132px" BackColor="LightSteelBlue" ForeColor="Snow"></asp:Label>
                            <asp:Button ID="btnViewPictures" runat="server" Height="22px" Style="z-index: 102; left: 4px; position: relative; top: 0px" Text="View Pictures" Width="132px" BackColor="Gainsboro" ForeColor="DarkGreen" OnClick="btnViewPictures_Click" Font-Size="Medium" />
                        </asp:Panel>
                        <br />
                        <br /></td>
                    </tr>
                    <asp:ScriptManager ID="ScriptManager1" runat="server">
                    </asp:ScriptManager>
                    <tr>
                        <td align="right" style="width: 355px">Upload Picture:</td> 
                        <td align="left"><asp:FileUpload ID="upldImage" runat="server"/></td>
                    </tr>
                    <tr>
                        <td align="right" style="width: 355px">Picture Name:</td> 
                        <td align="left"><asp:TextBox ID="txtImageName" runat="server"></asp:TextBox></td>
                    </tr>
                    <tr> 
                        <td align="right" style="width: 355px">Add to Album:</td>
                        <td align="left"><asp:DropDownList ID="ddlAlbum" runat="server"></asp:DropDownList>
                        <asp:Button ID="btnLaunchModal" runat="server" Text="Create New Album" OnClientClick="javascript:$find('uxModalPopupExtender').show();" /></td>
                    </tr>
                    <tr>
                        <td align="center" colspan="2"><asp:Button ID="btnUploadPicture" runat="server" Text="Upload" OnClick="btnUploadPicture_Click"/></td>
                    </tr>
                    </table>
                    <asp:UpdatePanel ID="uxUpdatePanel" runat="server">
                        <ContentTemplate>
                            Album Name: <asp:TextBox id="txtAlbumName" runat="server"></asp:TextBox>
                            <asp:Button ID="btnCreateAlbum" runat="server" Text="Create" OnClick="btnCreateAlbum_Click" OnClientClick="javascript:$find('uxModalPopupExtender').hide();"></asp:Button> <br />
                            <asp:Button ID="btnDone" runat="server" Text="Done" OnClientClick="javascript:$find('uxModalPopupExtender').hide();"></asp:Button> 
                        </ContentTemplate>
                    </asp:UpdatePanel>
                    <ajaxToolKit:ModalPopupExtender 
                        ID="uxModalPopupExtender" 
                        runat="server"
                        TargetControlID = "btnLaunchModal"
                        PopupControlID = "uxUpdatePanel"
                        OkControlID="btnDone">
                    </ajaxToolKit:ModalPopupExtender>
                <div style='color:red'>
                    <asp:Literal Runat="server" ID="lblMessage" />
                </div>
 
 
 
 
protected void btnCreateAlbum_Click(object sender, EventArgs e) {
            try {
                NAITBook.Controller.AddAlbum(userID, txtAlbumName.Text);
                lblMessage.Text = "Album added successfully.";
            }
            catch (Exception ex) {
                lblMessage.Text = "Cannot create album. " + ex.Message;
            }
    }

Open in new window

tqrecordsAsked:
Who is Participating?
 
David RobitailleConnect With a Mentor Analyst ProgrammerCommented:
Hi,
first, dont link direcltly the update panel to the modal pupup, link it to a "standard" panel instead. id you still need to do update on the things in the panel, then put a update panel into the "standard" panel.
i think you will find the following link interesting.
http://blogs.technet.com/kirtid/archive/2007/05/03/using-updatepanels-with-modalpopups.aspx
also, make sure you use the client id of the popup, i use something like this

dont hesitate if you need more help.

 <asp:Button runat="server" ID="hiddenTargetControlForModalDownloadPDFPanelPopup" style="display:none"/>
        <asp:Panel ID="DownloadPDFPanel" runat="server" CssClass="updateProgress"> 
               <div style="position: relative; top: 30%; text-align: center;">   
                   <asp:Button ID="Download" runat="server" Text="Download PDF" OnClientClick="HideDownloadPopup()" />
               </div>
        </asp:Panel>
        <cc1:ModalPopupExtender ID="DownloadPDFModalPopup" runat="server" 
            TargetControlID="hiddenTargetControlForModalDownloadPDFPanelPopup"  
            BackgroundCssClass="modalTextBoxBackground" 
            PopupControlID="DownloadPDFPanel"
            DropShadow="true" />
 
<script type="text/javascript"> 
var ModalGeneratingPDF ='<%= DownloadPDFModalPopup.ClientID %>'; 
 
function HideDownloadPopup() 
{ 
// hide the Popup 
$find(ModalGeneratingPDF).hide(); 
} 
 
</script> 

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.