Link to home
Start Free TrialLog in
Avatar of Phil Stratford
Phil StratfordFlag for United Kingdom of Great Britain and Northern Ireland

asked on

ASP.NET Accordion and AsyncFileUploader Mysterious Problems

I'm trying to design a web form for users to submit information and photographs, which will be added directly into a backend SQL database.  The form I've created looks nice and appears to work very well at first glance, but sadly not on closer inspection!

The form allows a user to submit details of cancerous tumours in animals.  The first part of the form is for details of the animal and the referring vet.  For each animal there could be numerous tumours, so the second half of the form is comprised of an ASP.NET Accordion control with four panes (for up to four tumours).  Contained within each pane are four AJAX AsyncFileUploader controls (for up to four photographs of each tumour).

When the form loads the first accordion pane is visible and the user can happily fill in the form and details of a first tumour, along with four photographs.  But then the problems begin.

In Google Chrome the AsyncFileUploader controls in each of the other three accordion panes don't have 'Upload' buttons when the panes are expanded, presumably because these somehow aren't rendered since the pane isn't visible when the form loads.  What's more, despite having taken steps to increase the maximum file size (by tweaking httpRuntime settings in Web.config) I get an 'unknown server error' if I try to upload more than about eight or nine files.

That wouldn't be disastrous if the form worked in Internet Explorer since I imagine most users will have this browser.  However, the problems in IE8 are almost worse.  The buttons appear correctly next to each AsyncFileUploader control in each Accordion pane, unlike Chrome.  However, whilst the AsyncFileUploader controls in panes 1 and 2 work perfectly, the ones in panes 3 and 4 do nothing.  You click the button, select a file, but then nothing happens.  No filepath in the textbox, no throbber.  This is particularly mysterious because the code for the four panes is identical with the exception of the numbering in the IDs of the controls, and besides, the AsyncFileUploader code is only one line - very easy to check!

I've attached the code for the page.  If anybody can shed any light, particularly on why on earth the AsyncFIleUploader controls in the first two Accordion panes work correctly and the ones in the second two don't in IE, I'd be very grateful!
<%@ Page Title="Sarcoid Referral Form" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="Submit.aspx.vb" Inherits="ReferralForm" %>

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>


<asp:Content ID="Content" ContentPlaceHolderID="MainContent" Runat="Server">

<script type="text/javascript">
    <!--
    function onSubmitted() {
        window.location = "http://www.liv.ac.uk/" 
    }//-->
</script>

<div id="form">

    <asp:ValidationSummary ID="ValidationGroupSummary" runat="server" 
        ValidationGroup="ValidationGroup" 
        HeaderText="Please complete the following fields:" ShowMessageBox="True" />
          

    <div class="fielddiv">
        <asp:Label ID="lblDate" runat="server" Text="Date" /><br />
        <asp:TextBox ID="txtDate" runat="server" CssClass="shorttextbox" 
            />
        <asp:CalendarExtender ID="txtDate_CalendarExtender" runat="server" 
            PopupPosition="Right" TargetControlID="txtDate" 
            TodaysDateFormat="dd, MMMM, yyyy" />
        <asp:RequiredFieldValidator ID="validatorDate" runat="server" 
            ControlToValidate="txtDate" Display="Dynamic" 
            ErrorMessage="Date" ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
    </div>


    <div class="leftsectiontitlediv">
        <asp:Label ID="lblVetSectionTitle" runat="server" Text="Referring Vet Details" />
    </div>

    <div class="rightsectiontitlediv">
        <asp:Label ID="lblHorseSectionTitle" runat="server" Text="Horse and Owner Details" />
    </div>

    
<%--The left-hand column of the form===============================================--%>
    <div class="leftdiv">        
        
        <div class="fielddiv">
            <asp:Label ID="lblVetSurgeonName" runat="server" Text="Vet Surgeon's Name" /><br />
            <asp:TextBox ID="txtVetSurgeonName" runat="server" CssClass="longtextbox" 
                 />
            <asp:RequiredFieldValidator ID="validatorVetSurgeonsName" runat="server" 
                ControlToValidate="txtVetSurgeonName" ErrorMessage="Vet Surgeon's Name" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblPracticeName" runat="server" Text="Practice Name" /><br />
            <asp:TextBox ID="txtPracticeName" runat="server" CssClass="longtextbox" 
                />            
            <asp:RequiredFieldValidator ID="validatorPracticeName" runat="server" 
                ControlToValidate="txtPracticeName" ErrorMessage="Practice Name" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblStreetAddress" runat="server" Text="Street Address" /><br />
            <asp:TextBox ID="txtStreetAddress" runat="server" CssClass="longtextbox" 
                 />            
            <asp:RequiredFieldValidator ID="validatorStreetAddress" runat="server" 
                ControlToValidate="txtStreetAddress" ErrorMessage="Practice Street Address" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblTown" runat="server" Text="Town" /><br />
            <asp:TextBox ID="txtTown" runat="server" CssClass="longtextbox" 
                />            
            <asp:RequiredFieldValidator ID="validatorTown" runat="server" 
                ControlToValidate="txtTown" ErrorMessage="Practice Town" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblCounty" runat="server" Text="County" /><br />
            <asp:TextBox ID="txtCounty" runat="server" CssClass="longtextbox" 
                />            
            <asp:RequiredFieldValidator ID="validatorCounty" runat="server" 
                ControlToValidate="txtCounty" ErrorMessage="Practice County" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblCountry" runat="server" Text="Country" /><br />
            <asp:TextBox ID="txtCountry" runat="server" CssClass="longtextbox" 
                 />            
            <asp:RequiredFieldValidator ID="validatorCountry" runat="server" 
                ControlToValidate="txtCountry" ErrorMessage="Practice Country" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblPostcode" runat="server" Text="Postcode" /><br />
            <asp:TextBox ID="txtPostcode" runat="server" CssClass="shorttextbox" 
               />            
            <asp:RequiredFieldValidator ID="validatorPostcode" runat="server" 
                ControlToValidate="txtPostcode" ErrorMessage="Postcode" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>
        
        <div class="fielddiv">
            <asp:Label ID="lblEmail" runat="server" Text="Email Address" /><br />
            <asp:TextBox ID="txtEmail" runat="server" CssClass="longtextbox" 
                />            
            <asp:RequiredFieldValidator ID="validatorEmail" runat="server" 
                ControlToValidate="txtEmail" ErrorMessage="Practice Email Address" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblTelephone" runat="server" Text="Telephone Number" /><br />
            <asp:TextBox ID="txtTelephone" runat="server" CssClass="shorttextbox" 
                />            
            <asp:RequiredFieldValidator ID="validatorPracticeTelephone" runat="server" 
                ControlToValidate="txtTelephone" ErrorMessage="Practice Telephone Number" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblFax" runat="server" Text="Fax Number" /><br />
            <asp:TextBox ID="txtFax" runat="server" CssClass="shorttextbox" />            
            <asp:RequiredFieldValidator ID="validatorFax" runat="server" 
                ControlToValidate="txtFax" ErrorMessage="Practice Fax Number" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>
    </div>

<%--The right-hand column of the form==============================================--%>
    <div class="rightdiv">
    
        <div class="fielddiv">
            <asp:Label ID="lblHorseName" runat="server" Text="Horse's Name" /><br />
            <asp:TextBox ID="txtHorseName" runat="server" CssClass="longtextbox" 
               />
            <asp:RequiredFieldValidator ID="validatorHorseName" runat="server" 
                ControlToValidate="txtHorseName" ErrorMessage="Horse's Name" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblAge" runat="server" Text="Age" /><br />
            <asp:TextBox ID="txtAge" runat="server" CssClass="shorttextbox" 
                />
            <asp:RequiredFieldValidator ID="validatorAge" runat="server" 
                ControlToValidate="txtAge" ErrorMessage="Horse's Age" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblSex" runat="server" Text="Sex" /><br />
            <asp:RadioButtonList ID="rbSex" runat="server" RepeatDirection="Horizontal" 
                >
                <asp:ListItem>Male</asp:ListItem>
                <asp:ListItem>Female</asp:ListItem>
            </asp:RadioButtonList>         
            <asp:RequiredFieldValidator ID="validatorSex" runat="server" 
                ControlToValidate="rbSex" ErrorMessage="Horse's Sex" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblBreed" runat="server" Text="Breed" /><br />
            <asp:TextBox ID="txtBreed" runat="server" CssClass="longtextbox" 
                 />
            <asp:RequiredFieldValidator ID="validatorBreed" runat="server" 
                ControlToValidate="txtBreed" ErrorMessage="Horse's Breed" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblColour" runat="server" Text="Colour" /><br />
            <asp:TextBox ID="txtColour" runat="server" CssClass="shorttextbox" 
                 />
            <asp:RequiredFieldValidator ID="validatorColour" runat="server" 
                ControlToValidate="txtColour" ErrorMessage="Horse's Colour" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblHeight" runat="server" Text="Height" /><br />
            <asp:TextBox ID="txtHeight" runat="server" CssClass="shorttextbox" 
                 />
            <asp:RequiredFieldValidator ID="validatorHeight" runat="server" 
                ControlToValidate="txtHeight" ErrorMessage="Horse's Height" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblOwnerName" runat="server" Text="Owner's Name" /><br />
            <asp:TextBox ID="txtOwnerName" runat="server" CssClass="longtextbox" 
                 />
            <asp:RequiredFieldValidator ID="validatorOwnersName" runat="server" 
                ControlToValidate="txtOwnerName" ErrorMessage="Owner's Name" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
        </div>

        <div class="fielddiv">
            <asp:Label ID="lblOwnerTelephone" runat="server" Text="Owner's Telephone Number*" /><br />
            <asp:TextBox ID="txtOwnerTelephone" runat="server" CssClass="shorttextbox" 
                />
            <asp:RequiredFieldValidator ID="validatorOwnersTelephone" runat="server" 
                ControlToValidate="txtOwnerTelephone" ErrorMessage="Owner's Telephone" 
                ValidationGroup="ValidationGroup">*</asp:RequiredFieldValidator>
            <br />
            <asp:Label ID="lblOwnerTelephoneNote" runat="server" CssClass="footnote" Text="*This will only be used if we are unable to contact the Veterinary Surgeon" />
        </div>
    

    </div>
    <div style="clear:both" />

</div>

 </div> <%--I know this tag appears to be extraneous but the page doesn't render correctly without it!--%>

<%-- The accordion control, where the lesions are entered=============================--%>
     <div id="lesions">

        <%--Lesion 1==================================================================--%>
         
             <asp:Accordion ID="Accordion1" runat="server" AutoSize="None" 
                 ContentCssClass="AccordionContent" FadeTransitions="false"  
                 HeaderCssClass="AccordionHeader" HeaderSelectedCssClass="AccordionSelected" 
                 SuppressHeaderPostbacks="true" TransitionDuration="250">
                 <Panes>
                     <asp:AccordionPane ID="AccordionPane1" runat="server">
                         <Header>
                             <asp:Label ID="lblLesion1" runat="server" Text="Lesion 1" />
                         </Header>
                         <Content>
                             <div class="leftdiv">
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion1Location" runat="server" Text="Location" />
                                     <br />
                                     <asp:TextBox ID="txtLesion1Location" runat="server" CssClass="longtextbox"  />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion1Type" runat="server" Text="Type (if known)" />
                                     <br />
                                     <asp:TextBox ID="txtLesion1Type" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion1Extent" runat="server" Text="Extent" />
                                     <br />
                                     <asp:TextBox ID="txtLesion1Extent" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion1History" runat="server" 
                                         Text="Please provide any history of the lesion, including any previous trauma or treatment" />
                                     <br />
                                     <asp:TextBox ID="txtLesion1History" runat="server" CssClass="memobox" 
                                         textmode="MultiLine" />
                                 </div>
                             </div>
                             <div class="rightdiv">
                                 <div class="uploaddiv">
                                     <asp:Label ID="lblLesion1Upload" runat="server" 
                                         Text="You may upload up to four photographs of this lesion below (high-res .jpg preferred)" />
                                     <br /><br />
                                     <asp:AsyncFileUpload ID="Lesion1Upload1" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L1U1Loader" Width="380px" />
                                     <asp:Image ID="L1U1Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />                                     
                                     <asp:AsyncFileUpload ID="Lesion1Upload2" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L1U2Loader" Width="380px" />
                                     <asp:Image ID="L1U2Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion1Upload3" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L1U3Loader" Width="380px" />
                                     <asp:Image ID="L1U3Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion1Upload4" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L1U4Loader" Width="380px" />
                                     <asp:Image ID="L1U4Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                 </div>
                             </div>

                         </Content>
                     </asp:AccordionPane>

                     <%--Lesion 2==================================================================--%>
                     <asp:AccordionPane ID="AccordionPane2" runat="server">
                         <Header>
                             <asp:Label ID="lblLesion2" runat="server" Text="Lesion 2" />
                         </Header>
                         <Content>
                             <div class="leftdiv">
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion2Location" runat="server" Text="Location" />
                                     <br />
                                     <asp:TextBox ID="txtLesion2Location" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion2Type" runat="server" Text="Type (if known)" />
                                     <br />
                                     <asp:TextBox ID="txtLesion2Type" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion2Extent" runat="server" Text="Extent" />
                                     <br />
                                     <asp:TextBox ID="txtLesion2Extent" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion2History" runat="server" 
                                         Text="Please provide any history of the lesion, including any previous trauma or treatment" />
                                     <br />
                                     <asp:TextBox ID="txtLesion2History" runat="server" CssClass="memobox" 
                                         textmode="MultiLine" />
                                 </div>
                             </div>
                             <div class="rightdiv">
                                 <div class="uploaddiv">
                                     <asp:Label ID="lblLesion2Upload" runat="server" 
                                         Text="You may upload up to four photographs of this lesion below (high-res .jpg preferred)" />
                                     <br /><br />
                                     <asp:AsyncFileUpload ID="Lesion2Upload1" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L2U1Loader" Width="380px" />
                                     <asp:Image ID="L2U1Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />                                     
                                     <asp:AsyncFileUpload ID="Lesion2Upload2" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L2U2Loader" Width="380px" />
                                     <asp:Image ID="L2U2Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion2Upload3" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L2U3Loader" Width="380px" />
                                     <asp:Image ID="L2U3Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion2Upload4" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L2U4Loader" Width="380px" />
                                     <asp:Image ID="L2U4Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                 </div>
                             </div>

                         </Content>
                     </asp:AccordionPane>

                     <%--Lesion 3==================================================================--%>
                     <asp:AccordionPane ID="AccordionPane3" runat="server">
                         <Header>
                             <asp:Label ID="lblLesion3" runat="server" Text="Lesion 3" />
                         </Header>
                         <Content>
                             <div class="leftdiv">
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion3Location" runat="server" Text="Location" />
                                     <br />
                                     <asp:TextBox ID="txtLesion3Location" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion3Type" runat="server" Text="Type (if known)" />
                                     <br />
                                     <asp:TextBox ID="txtLesion3Type" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion3Extent" runat="server" Text="Extent" />
                                     <br />
                                     <asp:TextBox ID="txtLesion3Extent" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion3History" runat="server" 
                                         Text="Please provide any history of the lesion, including any previous trauma or treatment" />
                                     <br />
                                     <asp:TextBox ID="txtLesion3History" runat="server" CssClass="memobox" 
                                         textmode="MultiLine" />
                                 </div>
                             </div>
                             <div class="rightdiv">
                                 <div class="uploaddiv">
                                     <asp:Label ID="lblLesion3Upload" runat="server" 
                                         Text="You may upload up to four photographs of this lesion below (high-res .jpg preferred)" />
                                     <br /><br />
                                     <asp:AsyncFileUpload ID="Lesion3Upload1" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L3U1Loader" Width="380px" />
                                     <asp:Image ID="L3U1Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />                                     
                                     <asp:AsyncFileUpload ID="Lesion3Upload2" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L3U2Loader" Width="380px" />
                                     <asp:Image ID="L3U2Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion3Upload3" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L3U3Loader" Width="380px" />
                                     <asp:Image ID="L3U3Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion3Upload4" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L3U4Loader" Width="380px" />
                                     <asp:Image ID="L3U4Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                 </div>
                             </div>

                         </Content>
                     </asp:AccordionPane>

                     <%--Lesion 4==================================================================--%>
                     <asp:AccordionPane ID="AccordionPane4" runat="server">
                         <Header>
                             <asp:Label ID="lblLesion4" runat="server" Text="Lesion 4" />
                         </Header>
                         <Content>
                             <div class="leftdiv">
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion4Location" runat="server" Text="Location" />
                                     <br />
                                     <asp:TextBox ID="txtLesion4Location" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion4Type" runat="server" Text="Type (if known)" />
                                     <br />
                                     <asp:TextBox ID="txtLesion4Type" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion4Extent" runat="server" Text="Extent" />
                                     <br />
                                     <asp:TextBox ID="txtLesion4Extent" runat="server" CssClass="longtextbox" />
                                 </div>
                                 <div class="fielddiv">
                                     <asp:Label ID="lblLesion4History" runat="server" 
                                         Text="Please provide any history of the lesion, including any previous trauma or treatment" />
                                     <br />
                                     <asp:TextBox ID="txtLesion4History" runat="server" CssClass="memobox" 
                                         textmode="MultiLine" />
                                 </div>
                             </div>
                             <div class="rightdiv">
                                 <div class="uploaddiv">
                                     <asp:Label ID="lblLesion4Upload" runat="server" 
                                         Text="You may upload up to four photographs of this lesion below (high-res .jpg preferred)" />
                                     <br /><br />
                                     <asp:AsyncFileUpload ID="Lesion4Upload1" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L4U1Loader" Width="380px" />
                                     <asp:Image ID="L4U1Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />                                     
                                     <asp:AsyncFileUpload ID="Lesion4Upload2" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L4U2Loader" Width="380px" />
                                     <asp:Image ID="L4U2Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion4Upload3" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L4U3Loader" Width="380px" />
                                     <asp:Image ID="L4U3Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                     <asp:AsyncFileUpload ID="Lesion4Upload4" runat="server" UploaderStyle="Modern" UploadingBackColor="#CCFFFF" ThrobberID="L4U4Loader" Width="380px" />
                                     <asp:Image ID="L4U4Loader" runat="server" ImageUrl="~/Images/ajax-loader.gif" />
                                 </div>
                             </div>

                         </Content>
                     </asp:AccordionPane>
                 </Panes>
             </asp:Accordion>
         </div>
   

    

    <div id="submitdiv">
        <asp:Button ID="btnSubmit" runat="server" CssClass="submitbutton" Text="Submit Form" ValidationGroup="ValidationGroup" CommandName="Insert" />
    </div>
    


    <asp:Panel ID="SubmittingPanel" runat="server" CssClass="modalPopup">
        <asp:Label ID="lblSubmitting" runat="server" Text="Your enquiry has been sumitted.  Your case number is: " />
        <asp:Label ID="lblCaseNo" runat="server" Text="229001." CssClass="caseno" /><br />
        <asp:Button ID="btnSubmitOK" runat="server" Text="OK" />
        <asp:Button ID="btnCancel" runat="server" Text="cancel" CssClass="hidden" />
    </asp:Panel>

    <asp:ModalPopupExtender ID="SubmittingPanel_ModalPopupExtender" runat="server" 
        PopupControlID="SubmittingPanel" 
        TargetControlID="btnDummy"
        BackgroundCssClass="modalBackground"
        OkControlID="btnSubmitOK"
        CancelControlID="btnCancel"
        OnOkScript="onSubmitted()">
    </asp:ModalPopupExtender>

    <asp:Button ID="btnDummy" Text="Dummy Button" runat="server" CssClass="hidden" />

    <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">
        </asp:ToolkitScriptManager>
   
    </asp:Content>

Open in new window

Avatar of G0ggy
G0ggy
Flag of United Kingdom of Great Britain and Northern Ireland image

Is this the best way to tackle this problem?

4 x Asyn uploaders in 4 panes, potential for 16 JPG images at 4MB each = 64MB upload.

Have you checked the Fiddler response? I wonder whether it is timing out, which could, of course, be extended, but if you're extending the server operation limit the finger points at design issues.

ASKER CERTIFIED SOLUTION
Avatar of Phil Stratford
Phil Stratford
Flag of United Kingdom of Great Britain and Northern Ireland image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial