UpdateProgress is not appear when loading gridview data

Hello Sir,

I am using a gridview and also update progress to display the records. But update progress is not showing when loading the data. Please help me as I am hereby sharing my codes below:

<tr>
<td align="center" colspan="2">
<asp:ImageButton ID="ImageButton1" runat="server" ImageUrl="~/images/search.jpg" onclick="ImageButton1_Click" />
</td>
</tr>
<tr>
<td align="center" colspan="2">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="gvSearchJobs" runat="server" CellPadding="4"
ForeColor="#333333" GridLines="None">
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
<EditRowStyle BackColor="#999999" />
<FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#284775" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#E9E7E2" />
<SortedAscendingHeaderStyle BackColor="#506C8C" />
<SortedDescendingCellStyle BackColor="#FFFDF8" />
<SortedDescendingHeaderStyle BackColor="#6F8DAE" />
</asp:GridView>
<asp:UpdateProgress ID="UpdateProgress1" runat="server">
<ProgressTemplate>
<div class="overlay" />
<div class="overlayContent">
<img id="Img1" alt="" src="../images/Loading (3).gif" runat="server" style="vertical-align:middle;" />
</div>
</ProgressTemplate>
</asp:UpdateProgress>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>