Solved

"Busy Animation" without an UpdatePanel

Posted on 2013-01-15
3
436 Views
Last Modified: 2013-08-28
I have an Upload form on my page. Given ASP:FileUpload's proclivity for getting in a fight with the AJAX:UpdatePanel, I'm running the form sans the panel. The form runs great, but I'm getting users with 100+ thousand record files to upload, and at times it takes upwards of a minute to load their files into the database.

Now, if the AJAX:AsyncFileUpload worked on our server (there's some obscure issue with the server that forced me into using ASP:FileUpload instead) I'd be using an UpdatePanel, and subsequently an UpdateProgress... But I can't use either, as the form has to exist outside an UpdatePanel to allow the file to actually be detected.

So this brings me to the question:

Is there a simple and elegant way to implement "UpdateProgress" like functionality, without using AJAX:UpdatePanel/AJAX:UpdateProgress?
0
Comment
Question by:Paul Kahl
[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
  • 2
3 Comments
 
LVL 41

Expert Comment

by:guru_sami
ID: 38780207
Here's some very basic way you can try:

1: Add a div and make it hidden:
2: Make it visible via jquery when your upload button is clicked.
3: The div should hide itself when the postback is finished.

Note: You can make the content of that div as fancy as you like. e.g. add an progress gif

<script type="text/javascript">
        $(function () {
            $("#btnUploadprog").click(function () {
                $("#progress").show();
            });
        });
    </script>

<asp:FileUpload ID="FileUpload1" runat="server" />
    <asp:Button ID="btnUploadprog" runat="server" Text="Upload with Progress" 
        onclick="btnUploadprog_Click" />
    <div id="progress" style="display:none">
        Upload in progress...
    </div>

Open in new window

0
 
LVL 3

Author Comment

by:Paul Kahl
ID: 38807190
I gave that a whirl, but I got nothing appearing at all.

Code used:
    <%--SAP BW Actuals Uploader--%>
    <asp:Panel ID="pnlSAPBWActuals" runat="server">
        <script type="text/javascript">
            $(function () {
                $("#btnUploadSAPBWActuals").click(function () {
                    $("#pnlUploader_SAPBWActuals_Progress").show();
                });
            });
        </script>
        <div id="pnlUploader_SAPBWActuals_Progress" style="display:none">
            <img src="images/loading_animation_liferay.gif" />
        </div>

        <div style="padding: 5px;">
            <asp:FileUpload ID="fuSAPBWActuals" runat="server" UploaderStyle="Modern" Width="500" CssClass="submit" ClientIDMode="AutoID" />
            <asp:Button ID="btnUploadSAPBWActuals" runat="server" Text="Upload" OnClick="btnUploadSAPBWActuals_Click" CssClass="submit" style="margin-left: 10px;" />
        </div>
    </asp:Panel>

Open in new window

0
 
LVL 41

Accepted Solution

by:
guru_sami earned 500 total points
ID: 38807518
Are you getting any javascript errors?
Make sure you have added reference to jquery.

e.g. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
0

Featured Post

Salesforce Has Never Been Easier

Improve and reinforce salesforce training & adoption using WalkMe's digital adoption platform. Start saving on costly employee training by creating fast intuitive Walk-Thrus for Salesforce. Claim your Free Account Now

Question has a verified solution.

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

ASP.Net to Oracle Connectivity Recently I had to develop an ASP.NET application connecting to an Oracle database.As I am doing it first time ,I had to solve several problems. This article will help to such developers  to develop an ASP.NET client…
Introduction HyperText Transfer Protocol (http://www.ietf.org/rfc/rfc2616.txt) or "HTTP" is the underpinning of internet communication.  As a teacher of web development I have heard many questions, mostly from my younger students who have come to t…
Finding and deleting duplicate (picture) files can be a time consuming task. My wife and I, our three kids and their families all share one dilemma: Managing our pictures. Between desktops, laptops, phones, tablets, and cameras; over the last decade…

738 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