Display an Image using C# in Web Application

I have a Web Application that I built a C# class in that generates a Report. This report takes nearly 40 seconds to generate because it searches hundreds of folders for certain files. So I was hoping there was a way to display a "Loading.." icon as this report is generating. I have a gif stored in my Images folder that would be perfect. The research that I've done at this point mostly talks about picturebox's and image controls that can hold the image but I was hoping there was just a way of displaying the image above the report while its being created.

The Web Application is from a Web ADF Geocortex website and again I created a C# class that generates this report. Below is some code that may help.

/// <summary>
    /// Generates HTML for the current report using the data in
    /// the given table.
    /// </summary>
    /// <param name="reportLayers">The layers to include in the report.</param>
    /// <returns>
    public override string GenerateReportHtml(List<ReportLayer> reportLayers)
    {
        StringBuilder htmlString = new StringBuilder();
        StringWriter stringWriter = new StringWriter(htmlString);
        HtmlTextWriter writer = new HtmlTextWriter(stringWriter);



        string holdAPI = "";

        List<string> exclusions = GetExcludedFields();

        foreach (ReportLayer layer in reportLayers)
        {
            string[] strFiles = null;
            Boolean val = false;

            if (layer.Layer.Name == "Bottom Hole Location (OP)")
            writer.RenderBeginTag(HtmlTextWriterTag.P); // <p>
            writer.RenderBeginTag(HtmlTextWriterTag.Strong); // <strong>
            writer.Write(layer.Layer.Name);

            writer.RenderEndTag(); // end </strong>
            writer.RenderEndTag(); // end </p>

            writer.WriteBreak(); // <br />
            foreach (ReportFeature feature in layer.ReportFeatures)
            {

            // each feature will be in a table
                wri开发者_运维百科ter.RenderBeginTag(HtmlTextWriterTag.Table); // <table>

                foreach (ReportField field in feature.ReportFields)
                {
                    string fieldName = field.Alias;
                    if (!exclusions.Contains(fieldName))
                    {

with this html...

<div id="rpt">
    <img src="Images/Load.Gif" />
</div>

then a jQuery ajax post on document.ready..

<script type="text/javascript">
    $(function() {
        $.post("/path/to/report", function(reportHtml) {
            $("#rpt").html(reportHtml);
        });
    });
</script>

When the ajax call returns you replace the div html with report. This would remove the image.

A crystal report, a SSRS report, a custom report? This makes a difference, but if you can determine when the report is finished loading. I would consider using client side javascript to display an image and then remove that image when the report is finished loading. Really its hard to give you more unless you give us some code examples or elaborate in your question.

Sounds like a job for JQuery... here's an article which I think talks about what you're trying to achieve.

It'd be along the lines of

1. Page Loads. -- insert a spinner.gif into the middle of a div which will contain the report
2. Use JQuery to Get the report url setting it to fill the div with the results of the request.
3. When it's loaded the report it should appear in said div.