Click here to Skip to main content
15,940,430 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hello guys,
Does anyone have any suggestions for immediately clearing previous gridview results from the screen and displaying a processing message when performing button click event as full postback?

ASP.NET 4.5 C# Webforms site with master page.
I'm using the fileupload control which requires a full postback. The asyncfileupload control is not a good fit for my project.

Asyncpostback breaks fileupload.
I'm able to get the processing message to display by pointing OnClientClick to a javascript function. I'm able to get the gridview results to clear by creating a hidden button and using javascript to perform the click also from OnClientClick.
However, I cannot get these two javascript commands to run together. The gridview does clear, but I only see the processing message for a split second before it disappears even when the main button click event is still running in the background. I have tried both sleep and settimeout between the two javascript commands, but that prevents the processing message from displaying at all. Below is what I have been experimenting with, any help is appreciated. Thanks!

Hidden button click event to clear gridview.
C#
protected void clearGridView_Click(object sender, EventArgs e)
        {
            this.resultsGridView.DataSource = null;
            this.resultsGridView.DataBind();
        }


GridView update panel
ASP.NET
<asp:UpdatePanel ID="gridviewUpdatePanel" runat="server" UpdateMode="Conditional">
        <ContentTemplate>
            <asp:button runat="server" id="clearGridView" class="hiddenSendButton" onclick="clearGridView_Click" style="visibility:hidden" />
            <div class="row">
                <div class="span12 pagination-centered">
                    <asp:GridView ID="resultsGridView" runat="server" GridLines="None" AllowPaging="false" CssClass="table table-hover table-striped" PagerStyle-CssClass="pgr" AlternatingRowStyle-CssClass="alt" AllowSorting="true" OnSorting="resultsGridView_Sorting"></asp:GridView>
                </div>
            </div>
        </ContentTemplate>
        <triggers>
            <asp:AsyncPostBackTrigger ControlID="clearGridView" />
        </triggers>
    </asp:UpdatePanel>


Execute button
ASP.NET
<asp:UpdatePanel ID="executeUpdatePanel" runat="server" UpdateMode="Conditional">
                    <ContentTemplate>
                        <div  runat="server" id="executeDiv" class="control-group">
                            <label class="control-label"></label>
                            <div class="controls">
                                <asp:Button id="executeButton" runat="server" text="Execute" OnClick="executeButton_Click" OnClientClick="ShowProgress();" name="executeButton" class="btn btn-primary"/>
                            </div>
                        </div>
                    </ContentTemplate>
                    <Triggers>
                        <asp:PostBackTrigger ControlID="executeButton" />
                    </Triggers>
                </asp:UpdatePanel>


Javascript
JavaScript
<script type="text/javascript">
    function ShowProgress() {
        document.getElementById('<%= clearGridView.ClientID %>').click();
        //sleep(500)
        //setTimeout(check, 1000);
        document.getElementById('<% Response.Write(processingUpdateProgress.ClientID); %>').style.display = "inline";
    }
</script>


Progress Update panel
<pre lang="HTML">
    <div class="row">
        <div class="span12 pagination-centered">
            <asp:UpdateProgress ID="processingUpdateProgress" AssociatedUpdatePanelID="executeUpdatePanel" runat="server">
                <ProgressTemplate>
                    <img alt="progressing" src="../Content/Images/processing.gif" />
                    Processing...
                </ProgressTemplate>
            </asp:UpdateProgress>
        </div>
    </div>
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900