Solved

Ajax trigger updatepanel question

Posted on 2013-11-20
1
482 Views
Last Modified: 2013-12-27
I have a page,
where there is a left pane and right pane.

right pane is inside the update panel and the right pane has a submit button as well.
also the right pane has a trigger such that when i click any item on the list box on left panel, the right pane gets refreshed based on the item clicked.

I need to have a progress bar on the right panel, such that when i click on the submit button inside the right panel updatepanel, the progress bar shows.

but, it is not showing up..

here is my code.

        <table cellpadding="0" cellspacing="0" border="0" style="margin-left: 20px;" width="98%" class="PanelContainer">
            <tr class="PanelTitle">
                <td>
                    Reports
                </td>
            </tr>
            <tr>
                <td>
                    <div style ="height:380px; width:200px;  border-right:solid 1px #808080; float:left; margin-right:100px; padding-left: 0px;">
                        <asp:GridView  Width="200" runat="server" id ="gridReports" AutoGenerateColumns="False<wbr ></wbr>" ShowHeader="False"
                            Cellpadding="4"
                            CssClass="mGrid" 
                            GridLines="None"  
                            onrowcommand="gridReports_<wbr ></wbr>RowCommand<wbr ></wbr>" 
                            DataKeyNames="ReportID, Name" BorderColor="black" BorderStyle="None" >
                             <AlternatingRowStyle BackColor="#DCDCDC" />
                            <Columns>
                                <asp:ButtonField CommandName="Select" DataTextField="Name" 
                                    Text="Select" />
                            </Columns>
                        </asp:GridView>
                    </div>
                    <div style ="height:400px; width:400px; border:solid 0px black;float:left">
                        
                    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
                    <ContentTemplate>
                
            <asp:ValidationSummary id="ValidationSummary1" runat="server" 
            ShowMessageBox="True" ShowSummary="False"></asp:<wbr ></wbr>Validation<wbr ></wbr>Summary>

            <asp:Table ID="Table1" runat="server">
                
            <asp:TableRow>
            <asp:TableCell BorderStyle="None"  BorderWidth="0px" BorderColor="Blue">
               <div style="margin-left:50px; font-weight: bold; margin-bottom: 10px;"> <asp:Label ID="lbTop"  runat="server"></asp:Label<wbr ></wbr>></div>
            </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
            <asp:TableCell ID="TableCell1" runat="server"  BorderStyle="Solid"  BorderWidth="0px" BorderColor="gray"  >
                <asp:Table ID="Table2" runat="server"    >
                    <asp:TableRow ID="tcParamRow">
                    <asp:TableCell VerticalAlign="Top" >         
                        <asp:Table  runat="server" ID="TableParameters" CssClass="tableparameters"<wbr ></wbr> >
                        </asp:Table>
                    </asp:TableCell>
                    <asp:TableCell Width="70px"  VerticalAlign="Top" HorizontalAlign="Center"  BorderStyle="none"  BorderWidth="0px" BorderColor="Blue">         
                        <%--<asp:UpdateProgress ID="progress1" runat="server" DisplayAfter="1">
                        <ProgressTemplate>
                            <asp:Panel ID="pnlProgressBar" runat="server" CssClass="progress">
                            <div class="progress">
                                <asp:Image ID="Image1" runat="Server"  ImageAlign="Middle" ImageUrl="~/spinner4-green<wbr ></wbr>ie.gif" />
                            </div>
                            </asp:Panel>
                        </ProgressTemplate>
                        </asp:UpdateProgress>--%>
                        </asp:TableCell>
                    </asp:TableRow>
                    <asp:TableRow>
                   <asp:TableCell HorizontalAlign="Center"  VerticalAlign="Bottom" ColumnSpan="2" > 
                         <asp:Table Width="300px"  ID="Table3" CellPadding="18" runat="server" >
                            <asp:TableRow Height="20">
                             <asp:TableCell CssClass="lnkButton" >
                                
                                <asp:LinkButton ID="btnRunReport" runat="server" Visible="False"  OnClick="btnRunReport_Clic<wbr ></wbr>k"  Width="150"  OnClientClick="return ValidateDateRange()">Creat<wbr ></wbr>e Report</asp:LinkButton>
                                <%--<asp:Button ID="btnRunReport" CssClass="Button"  Text="Create Report" runat="server" Visible="False" OnClick="btnRunReport_Clic<wbr ></wbr>k" Width="150" OnClientClick="return ValidateDateRange();" />--%> 
                            </asp:TableCell>
                            <asp:TableCell runat="server">
                                <input type="hidden" id="hidRangeDays" runat="server"/>
                            </asp:TableCell>    
                            </asp:TableRow>
                            <asp:TableRow ID = "trNote" runat="server" Visible="False">
                                <asp:TableCell ColumnSpan="2">
                                    <div style="margin-top: 30px; font-size: 11px;"><i><b>Note:</b> In the listbox above, hold control and left click on mouse to multiselect if it is enabled.</i> </div>
                                </asp:TableCell>
                            </asp:TableRow>
                        </asp:Table>    
                    </asp:TableCell>
                    </asp:TableRow>
                </asp:Table>
            </asp:TableCell>
            </asp:TableRow>
            <asp:TableRow>
            <asp:TableCell  BorderStyle="None"  BorderWidth="0px" BorderColor="LightBlue">
                <asp:PlaceHolder runat="server" ID="phMessage"  >
                </asp:PlaceHolder>
            </asp:TableCell>
            </asp:TableRow>
            </asp:Table>
                </ContentTemplate>
                <Triggers>
                <asp:AsyncPostBackTrigger ControlID="gridReports" EventName="Rowcommand" />
                </Triggers>
                </asp:UpdatePanel>

Open in new window

0
Comment
Question by:agorkhali
1 Comment
 
LVL 12

Accepted Solution

by:
jitendra patil earned 500 total points
ID: 39668520
hi,
you  need to add the associatedupdatepanel id to the updateprogress controls.

please see the link given below for complete refence of adding progress bars.
3 Different Ways to Display Progress in an ASP.NET AJAX Application

hope this helps.
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

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

Today I had a very interesting conundrum that had to get solved quickly. Needless to say, it wasn't resolved quickly because when we needed it we were very rushed, but as soon as the conference call was over and I took a step back I saw the correct …
jQuery is a JavaScript library that greatly simplifies JavaScript programming. AJAX is an acronym formed from "Asynchronous JavaScript and XML."  AJAX refers to any communication between client and server, when the human client does not observe a…
This Micro Tutorial demonstrates using Microsoft Excel pivot tables, how to reverse engineer competitors' marketing strategies through backlinks.
Many functions in Excel can make decisions. The most simple of these is the IF function: it returns a value depending on whether a condition you describe is true or false. Once you get the hang of using the IF function, you will find it easier to us…

895 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

12 Experts available now in Live!

Get 1:1 Help Now