Solved

ASP.NET Accordion and AsyncFileUploader Mysterious Problems

Posted on 2010-08-25
2
875 Views
Last Modified: 2012-05-10
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

0
Comment
Question by:PSi
2 Comments
 
LVL 11

Expert Comment

by:G0ggy
Comment Utility
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.

0
 
LVL 4

Accepted Solution

by:
PSi earned 0 total points
Comment Utility
I don't think it was timing out because the problems occurred even before the uploading began.  Anyway, I eventually fixed this by redesigning the form so that it's now a sort of 'wizard', with each tumour as a separate step in the wizard, meaning that there are only four asyncfileuploaders on screen at any time, and these work fine.  This is a much better solution anyway as now the user can add as many tumours as they like by choosing the right option at the end of each step of the wizard, and is no longer restricted to just four.
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

A Change in PHP Behavior with Session Write Short Circuit (http://php.net/manual/en/book.session.php#116217) (Winter 2014)** With the release of PHP 5.6 the session handler changed in a way that many think should be considered a bug.  See the note …
It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
This video teaches users how to migrate an existing Wordpress website to a new domain.
Learn how to set-up PayPal payment integration in your Wufoo form. Allow your users to remit payment through PayPal upon completion of your online form. This is helpful for collecting membership payments, customer payments, donations, and more.

772 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

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now