Update Progress not working inside Gridview in Asp.Net

Question

I want to show PreLoader on button click inside Gridview. But it is not working as expected .

<asp:GridView ID="gv_deparment" runat="server" AutoGenerateColumns="false" OnRowCommand="gvPurchaseInvoiceEntry_RowCommand"
                                    AllowSorting="True" AllowPaging="True" OnPageIndexChanging="gv_deparment_PageIndexChanging" OnSorting="gv_deparment_Sorting"
                                    HeaderStyle-Font-Bold="false" CssClass="gvstyling gridview_width_100" ShowHeaderWhenEmpty="true" EmptyDataText="Record(s) Not Found!">
                                    <Columns>

                                        <asp:BoundField
                                            DataField="department"
                                            HeaderText="Department"
                                            SortExpression="department" />

                                        <asp:TemplateField HeaderText="Status" ItemStyle-Width="10">
                                            <ItemTemplate>
                                                <asp:UpdatePanel ID="UpdatePanel3" runat="server"            UpdateMode="Conditional" ChildrenAsTriggers="true">
                                                    <ContentTemplate>
                                                        <asp:LinkButton ID="btnUpdate" runat="server" CommandName="cmdUpdate"><i class="fa fa-edit"></i> Update </asp:LinkButton>
                                                        <asp:HiddenField ID="hf_departmnt" Value='<%#  Eval("department_id")%>' runat="server" />
                                                        <asp:CheckBox ID="ck_departmnt" OnCheckedChanged="ck_departmnt_CheckedChanged" AutoPostBack="true" runat="server" Checked='<%# Eval("isactive") %>' />
                                                    </ContentTemplate>
                                                    <Triggers>
                                                        <asp:AsyncPostBackTrigger ControlID="btnUpdate" EventName="Click" />
                                                    </Triggers>



                                                </asp:UpdatePanel>




                                            </ItemTemplate>
                                        </asp:TemplateField>

                                        <asp:TemplateField HeaderText="Update Message"  ItemStyle-Width="200">
                                            <ItemTemplate>
                                                <asp:UpdateProgress ID="UpdateProgressdf1"     runat="server" ClientIDMode="AutoID" Visible="true">
                                                    <ProgressTemplate>
                                                        <img src="../img/spinner-mini.gif" />
                                                        &nbsp; Please Wait...
                                                    </ProgressTemplate>
                                                </asp:UpdateProgress>
                                            </ItemTemplate>
                                        </asp:TemplateField>

                                    </Columns>
                                </asp:GridView> 

This is the problem that I am facing. On single button click, only preloader besides the button should be display. Here is the Image

But unfortunately all the preloader are displaying on single button click.

Any help will be appreciated

Answer 1

I think cause is you are not setting AssociatedUpdatePanelID . This link might help http://msdn.microsoft.com/en-us/library/bb386421%28v=vs.100%29.aspx