Develop Reference

Open a modal with a text area to fill and a text area loading some content from the page

I'm working with WebForms and I need to create a modal, or anything like this on click on a button to reject an item, the modal should show the item ID and a text area to fill up with the reason why this item will be rejected.
I'm on it for about one week and I can't figure out how could I get the item id and put it on the modal.
I've never used WebForms before, and I'm not finding anything that helps me.
this is my modal code:
<asp:Panel ID="pnlMotivoRejeitarTitulo" runat="server" Width="610px">
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Button runat="server" ID="btnShowModalPopup2" Style="display: none" />
<ajaxToolkit:ModalPopupExtender ID="modalRejeitarTitulo" runat="server" TargetControlID="btnShowModalPopup2"
PopupControlID="divPopUp2" BackgroundCssClass="popUpStyle" PopupDragHandleControlID="panelDragHandle"
DropShadow="true" RepositionMode="RepositionOnWindowResize" />
<div class="popUpStyle" id="divPopUp2" style="display: none;">
<div style="width: 600px; max-height: 160px;">
<asp:Panel runat="Server" ID="panel1" CssClass="drag01">
<asp:Label ID="lblTituloModal" runat="server" Text="EXCLUIR TÍTULO?"></asp:Label>
<br />
</asp:Panel>
<div class="subtitulo">
<asp:Label ID="lblMensagemOrigemAgregadoMiudo" runat="server" Text=""></asp:Label>
</div>
<br />
<asp:Panel ID="pnlRejeitarTitulo" runat="server" Width="550px" BackColor="#CCCCCC"
CssClass="centralizaPanel" BorderStyle="Outset">
<div style="padding-top: 10px;">
<div class="campo">
<div class="label_formulario8">
<asp:Label ID="lblId" runat="server" Text="ID: "></asp:Label>
</div>
<asp:TextBox ID="txtId" runat="server" Width="100px" ReadOnly="true"></asp:TextBox>
</div>
<div class="campo">
<div class="label_formulario8">
<asp:Label ID="Label3" runat="server" Text="Descrição: "></asp:Label>
</div>
<asp:TextBox ID="txtDescricao" runat="server" Width="300px"></asp:TextBox>
</div>
<br />
</div>
<div class="centraliza_botao">
<asp:Button ID="btnConfirmarExcluirTitulo" runat="server" Text="Confirmar" CssClass="btn btn-primary" OnClick="btnConfirmarExcluirTitulo_Click"
Style="height: 31px" CausesValidation="false" />
<asp:Button ID="btnFecharExcluirTitulo" runat="server" Text="Fechar" CssClass="btn btn-warning"
Style="height: 31px" CausesValidation="false" OnClick="btnFecharExcluirTitulo_Click" />
</div>
<br />
</asp:Panel>
</div>
<br />
<br />
</div>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</asp:Panel>
on txtId must appear the item ID, I've tried to use JS getting the id of the rendered input, but it take so long to render, so JS does not work.

I figured out that I had to fill all the fields before call the method that shows the modal dialog.
I was thinking like jQuery but it does work like that on WebForms

UpdatePanel AsyncPostBackTrigger does Postback

I've below design code containing updatepanel to the gridview and buttons as shown below -
<asp:ScriptManager ID="scrptmanager" runat="server"></asp:ScriptManager>
<div>
<asp:HiddenField ID="hdnSortValue" runat="server" />
</div>
<div class="current-btns" style="float: left !important;">
<div id="divFitnessSortBy" runat="server" class="fit-sort">
<table>
<tr>
<td>
<b>Sort by :</b>
</td>
<td>
<asp:Button ID="btnMostRecent" Text="Most Recent" class="button action sortcomments"
runat="server" OnCommand="btnMostRecent_Click" CommandArgument="date" />
</td>
<td>
<asp:Button ID="btnMostViewed" Text="Most Viewed" class="Comments" runat="server"
OnCommand="btnMostViewed_Click" CommandArgument="views" />
</td>
</tr>
</table>
</div>
<div class="clear">
</div>
</div>
<div class="hr">
</div>
<div class="BlogsPostHolderDiv" id="divPagination">
<asp:UpdatePanel ID="updtpanel" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:GridView ID="gvBlogsPost" runat="server" DataKeyNames="PostID" AutoGenerateColumns="False"
AllowPaging="false" Width="100%" OnRowDataBound="gvBlogsPost_Bound" GridLines="None">
<Columns>
<asp:TemplateField>
<ItemTemplate>
<div class="current-articles">
<div class="current-thumb">
<a id="lnkThumbnail" runat="server" rel="nofollow">
<asp:Image ID="imgThumbnail" runat="server" Height="135px" Width="186px" />
</a>
</div>
<div class="current-list">
<h2>
<a id="lnkArticle" runat="server">
<%# DataBinder.Eval(Container.DataItem, "Subject")%></a>
</h2>
<div class="views-comments">
<h5>
<asp:Label runat="server" ID="lblNewsletterDate" ForeColor="#808080"><%# DataBinder.Eval(Container.DataItem, "PostDate")%></asp:Label>
<span class="gray">|</span> <span id="spnViews" runat="server"><span>
<%#Convert.ToInt64(DataBinder.Eval(Container.DataItem, "TotalViews")).ToString("#,#")%>
Views </span></span>
</h5>
</div>
<asp:Label ID="lblShortDescription" runat="server"><%#DataBinder.Eval (Container.DataItem, "Body")%> </asp:Label>
</div>
<div class="clear">
</div>
</div>
<div class="hr">
</div>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="btnMostRecent" EventName="Click" />
<asp:AsyncPostBackTrigger ControlID="btnMostViewed" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
<input type="hidden" id="hdnLastArticle" value="10" />
When i click on btnMostRecent or btnMostViewed the page does postback which should not be the case...am i missing something here?
Expected - When i click on any of the given button only gvBlogsPost gridview should be updated without the whole page postback
Help and thanks in advance...!

It looks the only thing you have to do is make sure the triggers are in the same naming container.
According to MSDN:
The control that the AsyncPostBackTrigger control references must be
in the same naming container as the update panel for which it is a
trigger. Triggers that are based on controls in other naming
containers are not supported.

Certain controls won't get generated in aspx.designer.cs-file

I have a weird problem. I can't access some of my server controls from my codebehind. I've looked around and can only find answers for situations where you can't find ANY controls and I've tried all solutions I've found here on stack. re-creating designer file, deleting temp data, renaming controls etc. Nothing works.
The weird thing is that I can access every controller I put outside my ListView element. But everything inside will not get generated in my aspx.designer.cs file.
Code:
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolderMid" runat="server">
<h2><asp:Label ID="LabelCat" runat="server" Text=""></asp:Label></h2>
<asp:HiddenField ID="HiddenFieldID" runat="server" />
<br />
<div class="list-group">
<asp:ListView ID="ListViewSearch" runat="server" DataSourceID="SqlDataSourceWebsite" DataKeyNames="WebsiteID">
<EmptyDataTemplate>
<table runat="server">
<tr>
<td>Darn</td>
</tr>
</table>
</EmptyDataTemplate>
<ItemTemplate>
<td>
<div class="row list-group-item">
<div class="">
<%# Eval("url") %>
</div>
<div class="col-xs-5">
<div class="pull-left">
<div>
<asp:LinkButton ID="BtnUp" runat="server" CssClass="btn btn-default btn-xs" CommandArgument='<%# Eval("websiteId").ToString() %>' OnClick="up_click"><i class="fa fa-chevron-up" style="color:green"></i></asp:LinkButton>
</div>
<div>
<asp:LinkButton ID="BtnDown" runat="server" CssClass="btn btn-default btn-xs" CommandArgument='<%# Eval("websiteId").ToString() %>' OnCommand="down_click"><i class="fa fa-chevron-down" style="color:red"></i></asp:LinkButton>
</div>
</div>
<div class="lbl-score">
<asp:Label ID="LabelScore" runat="server" Text="Score: "></asp:Label>
<asp:ScriptManagerProxy ID="ScriptManagerProxySearch" runat="server"></asp:ScriptManagerProxy>
<asp:UpdatePanel ID="UpdatePanel2" runat="server">
<ContentTemplate>
<asp:Label ID="LabelRating" runat="server" Text=' <%# Eval("rating") %>'></asp:Label>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="BtnUp" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
</div>
</div>
<div class="lbl-desc">
<asp:Label ID="LabelDesc1" runat="server" Text=' <%# Eval("Description1") + " | "%> '></asp:Label>
<asp:Label ID="LabelDesc2" runat="server" Text=' <%# Eval("Description2") %> '></asp:Label>
</div>
</div>
</td>
</ItemTemplate>
</asp:ListView>
</div>
<asp:SqlDataSource ID="SqlDataSourceWebsite" runat="server" ConnectionString="<%$ ConnectionStrings:WDBAPPConnectionString %>" SelectCommand="SELECT * FROM [Website] WHERE ([categoryId] = #HFID)">
<SelectParameters>
<asp:ControlParameter ControlID="HiddenFieldID" Name="HFID" Type="Int32" DefaultValue="0" />
</SelectParameters>
</asp:SqlDataSource>
</asp:Content>
I know there is a lot of code but basically the controls "LabeCat", "HiddenFieldID", "ListViewSearch" and "SqlDataSourceWebsite" show up in my aspx.designer.cs-file, but no other controls do, in other words; all controls before and after my ListView work fine. What could be wrong here? So confused.

Button event doesn't fire inside Update panel

I have a asp.net web form Page which uses master page also.
This is a simple page which displays some text and has a form, this page also allows user to upload resume in .doc, .docx & pdf format.
Problem with this code is that i am not able to trigger
for some reason <asp:Button ID="btnUploadCV" runat="server" Text="Upload" CssClass="btnUpload" onclick="btnUploadCV_Click"/>
<%# Page Title="" Language="C#" MasterPageFile="~/en/SiteMasterPage.master" AutoEventWireup="true" CodeFile="career.aspx.cs" Inherits="career" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server"></asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<!-- Content Page-->
<!-- page content wrapper -->
<div id="page-content-area" class="page-content-area">
<div id="pg-left-bar" class="pg-left-bar">
<div class="page-title">
<h5><asp:Label ID="lblPageTitle" CssClass="page-title-lbl" runat="server" Text="Introduction"></asp:Label></h5>
</div>
<div class="page-text">
<asp:Label ID="lblPageContents" runat="server" Text=""></asp:Label>
</div>
<div class="career-form-wrapper">
<!-- UpdatePanel -->
<asp:UpdatePanel ID="updPnlArticles" runat="server" UpdateMode="Conditional">
<ContentTemplate>
<asp:Panel ID="pnlCareerForm" runat="server">
<div class="row-form">
<div class="row-lbl-wrapper"> <span class="row-req">*</span>
<asp:Label ID="lblFirstName" runat="server" CssClass="row-label" Text="First Name:"></asp:Label>
</div>
<asp:TextBox ID="txtFirstName" runat="server" CssClass="row-input"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfFN" runat="server" ValidationGroup="Careers" ErrorMessage="*" CssClass="row-validate" ControlToValidate="txtFirstName"></asp:RequiredFieldValidator>
</div>
<div class="row-form">
<div class="row-lbl-wrapper"> <span class="row-req">*</span>
<asp:Label ID="lblFamilyName" runat="server" CssClass="row-label" Text="Family Name:"></asp:Label>
</div>
<asp:TextBox ID="txtFamilyName" runat="server" CssClass="row-input"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfLN" runat="server" ValidationGroup="Careers" ErrorMessage="*" CssClass="row-validate" ControlToValidate="txtFamilyName"></asp:RequiredFieldValidator>
</div>
<div class="row-form">
<div class="row-lbl-wrapper"> <span class="row-req">*</span>
<asp:Label ID="lblEmail" runat="server" CssClass="row-label" Text="Email:"></asp:Label>
</div>
<asp:TextBox ID="txtEmail" runat="server" CssClass="row-input"></asp:TextBox>
<asp:RequiredFieldValidator ID="rfvEmail" runat="server" ValidationGroup="Careers" ErrorMessage="*" CssClass="row-validate" ControlToValidate="txtEmail"></asp:RequiredFieldValidator>
<asp:RegularExpressionValidator ID="revEmail" runat="server" ErrorMessage="*" CssClass="row-validate" ControlToValidate="txtEmail" ValidationExpression="\w+([-+.']\w+)*#\w+([-.]\w+)*\.\w+([-.]\w+)*" ValidationGroup="Careers"></asp:RegularExpressionValidator>
</div>
<div class="row-form">
<div class="row-lbl-wrapper">
<asp:Label ID="lblPhone" runat="server" CssClass="row-label" Text="Phone Number:"></asp:Label>
</div>
<asp:TextBox ID="txtPhone" runat="server" CssClass="row-phone" Text=""></asp:TextBox>
<asp:RegularExpressionValidator ID="revPhone" runat="server" ErrorMessage="*" ValidationGroup="Careers" ControlToValidate="txtPhone" ValidationExpression="^([\+]?[0-9]{1,3}[\s.-][0-9]{1,12})([\s.-]?[0-9]{1,4}?)$"></asp:RegularExpressionValidator>
<div class="tooltip tooltip-override" title="Accepts local format (eg. 04 1234567, 050 1234567 or 04-1234567, 050-1234657)<br />and international format (eg. +971 41234567, +971-41234567 ).<br />Also accepts an optional extention of up to four digits (eg. 04 1234567 289 or +974 41234567 289)">
<asp:Image ID="imgtooltip" CssClass="tooltip-img" runat="server" ImageUrl="~/images/tooltipgreen.png" />
</div>
</div>
<div class="row-form">
<div class="row-lbl-wrapper">
<asp:Label ID="lblFax" runat="server" CssClass="row-label" Text="Fax Number:"></asp:Label>
</div>
<asp:TextBox ID="txtFax" runat="server" CssClass="row-input"></asp:TextBox>
<asp:RegularExpressionValidator ID="revFax" runat="server" ErrorMessage="*" ValidationGroup="Careers" ControlToValidate="txtFax" ValidationExpression="^([\+]?[0-9]{1,3}[\s.-][0-9]{1,12})$"></asp:RegularExpressionValidator>
<div class="tooltip tooltip-override" title="Accepts local format (eg. 04 1234567 or 040-1234567)<br />and international format (eg. +974 41234567 or +974-41234567)">
<asp:Image ID="Image1" CssClass="tooltip-img" runat="server" ImageUrl="~/images/tooltipgreen.png" />
</div>
</div>
<div class="row-form">
<div class="row-lbl-wrapper">
<asp:Label ID="lblAddress" runat="server" CssClass="row-label" Text="Address:"></asp:Label>
</div>
<asp:TextBox ID="txtAddress" runat="server" CssClass="row-input-multiline" TextMode="MultiLine"></asp:TextBox>
</div>
<div class="row-form">
<div class="row-lbl-wrapper"> <span class="row-req">*</span>
<asp:Label ID="lblCountry" runat="server" CssClass="row-label" Text="Country:"></asp:Label>
</div>
<asp:DropDownList ID="ddCountry" runat="server" CssClass="row-dd"></asp:DropDownList>
<asp:CascadingDropDown ID="csdCountry" runat="server" Category="Country" TargetControlID="ddCountry" PromptText="-- Select --" LoadingText="[Loading Countries...]" ServiceMethod="FetchCountries" ServicePath="~/wsCountryCity.asmx" PromptValue="0"></asp:CascadingDropDown>
<asp:RequiredFieldValidator ID="rfCountry" ValidationGroup="Careers" ControlToValidate="ddCountry" CssClass="row-validate" InitialValue="0" runat="server" ErrorMessage="*"></asp:RequiredFieldValidator>
</div>
<div class="row-form">
<div class="row-lbl-wrapper">
<asp:Label ID="lblCity" runat="server" CssClass="row-label" Text="City:"></asp:Label>
</div>
<asp:DropDownList ID="ddCity" runat="server" CssClass="row-dd"></asp:DropDownList>
<asp:CascadingDropDown ID="csdCity" runat="server" Category="City" TargetControlID="ddCity" ParentControlID="ddCountry" PromptText="-- Select --" LoadingText="[Loading Cities...]" ServiceMethod="FetchCities" ServicePath="~/wsCountryCity.asmx" PromptValue="0"></asp:CascadingDropDown>
</div>
<div class="row-form">
<div class="row-lbl-wrapper"> <span class="row-req">*</span>
<asp:Label ID="Label1" runat="server" CssClass="row-label" Text="CV:"></asp:Label>
</div>
<asp:FileUpload ID="FileUpload1" runat="server" CssClass="fileUpload" />
<div id="dFileUpload1" class="btnUploadHack">Browse</div>
<asp:Button ID="btnUploadCV" runat="server" Text="Upload" CssClass="btnUpload" onclick="btnUploadCV_Click" />
<asp:RequiredFieldValidator ID="rfvF1" runat="server" ValidationGroup="Careers" ErrorMessage="*" CssClass="row-validate" ControlToValidate="FileUpload1"></asp:RequiredFieldValidator>
<asp:Label ID="lblImageMSG" runat="server" Text=""></asp:Label>
</div>
<div class="contactus-row">
<asp:Button ID="btnSave" runat="server" CssClass="btnContactUsSave" Text="Send Message" onclick="btnSave_Click" ValidationGroup="Careers" />
</div>
</asp:Panel>
<asp:Panel ID="pnlCareerMSG" runat="server"></asp:Panel>
</ContentTemplate>
</asp:UpdatePanel>
<!-- UpdatePanel -->
</div>
</div>
<div class="pg-right-bar">
<asp:Image ID="imgSideBanner" runat="server" />
</div>
</div>
<!-- page content wrapper -->
<!-- Content Page-->
</asp:Content>
Code Behind
protected void btnUploadCV_Click(object sender, EventArgs e)
{
// code is here
}
So far i am not able to figure out what i s blocking the any button inside from firing. Yes i did even put a simple button to test even that didn't fire.
I am not sure if it is Validation or Update Panel which is creating problem.

You need to add Triggers after ContentTemplate in Update panel.
<Triggers>
<asp:PostBackTrigger ControlID="btnexport" />
</Triggers>

The required field validators are probably biting you.Just add the property 'causes validation="false" ' to your button and it will fire.You can handle the validation server side using if Page.IsValid
<asp:Button ID="btnUploadCV" runat="server" Text="Upload" CssClass="btnUpload" onclick="btnUploadCV_Click" CausesValidation="false" />
Server Side
protected void btnUploadCV_Click(object sender, EventArgs e)
{
Page.Validate();
if (Page.IsValid == true)
{
// your code here
}
}
Update
I am not sure what is happening with your button.Then if all fails do a brute force attack to cause the post back like this.
<asp:Button ID="btnUploadCV" runat="server" Text="Upload" CssClass="btnUpload" onclick="btnUploadCV_Click" CausesValidation="false" onClientClick='forcePostBack()" />
**Javascript**
function forcePostback(){
__doPostBack('<%#btnUploadCv.UniqueID %>','');
}

How I can use the UpdateProgress Control to show a wait symbol?

I have an ASP.NET application with a ListView. I get data from Active Directory and now I want a wait symbol for the time if the ListVew is building. I thought I would use a UpdateProgress Control from Ajax Control toolkit. But I don't know how I can use it if I click on a Button and the wait symbol (for example a gif) closes if the ListView is finished. :(
My CS file:
protected void btnBenutzerSuchen_Click(object sender, EventArgs e)
{
//If I click on this Button the gif must start
try
{
... // my ListView get data
this.myListView.DataSource = dv;
this.myListView.DataBind();
...
}
catch (Exception)
{
...
}
//If the ListView is finish the gif must close
}
How I can do this? Can I do this with the UpdateProgress like this:
<asp:UpdateProgress ID="UpdateProgress1" DynamicLayout="true" runat="server" AssociatedUpdatePanelID="?" >
<ProgressTemplate>
<div class="progress">
<img src="images/ajax-loader-arrows.gif" /> please wait...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
My update.aspx file:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="~/BenutzerListe.aspx.cs" Inherits="BenutzerListe.BenutzerListe" %>
<%# Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripte/jquery-1.7.2.js" type="text/javascript"></script>
<script type="text/javascript" src="Scripte/jquery-ui-1.8.22.custom.min.js" ></script>
<script language="javascript" type="text/javascript">
// my javascript code
</script>
<link href="~/App_Theme/BenutzerListeStyle.css" type="text/css" rel="Stylesheet" />
<link href="App_Theme/jquery-ui-1.8.22.custom.css" type="text/css" rel="Stylesheet" />
<link href="App_Theme/PopUpDialog_Style.css" type="text/css" rel="Stylesheet" />
<style type="text/css">
#SuchTabelle
{
width: 587px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:scriptmanager id="ScriptManager1" runat="server">
</asp:scriptmanager>
<div class="header">
<br />
<table id="SuchTabelle" class="SuchTabelle" runat="server" border="0" width="100%">
<tr>
<th><asp:Label ID="id_SearchUser" runat="server" Text="lblSearchUser"></asp:Label></th>
<th class="txtBenutzerSuchen"><asp:TextBox ID="txtBenutzer" runat="server" Width="150px" ToolTip="Gesucht wird nach Vorname, Nachname, eMail , Abteilung und Telefonnummer"></asp:TextBox></th>
<th><asp:Label ID="id_location" runat="server" Text="lblLocation"></asp:Label></th>
<th class="DropDownList"><asp:DropDownList ID="dropWerk" runat="server" Width="200px" /></th>
<th>
<asp:Button ID="Button2" runat="server" Text="Suchen" onclick="btnBenutzerSuchen_Click" Width="150px"/>
</th>
</tr>
</table>
</div>
<div class="bodyList">
<asp:UpdatePanel ID="update" runat="server">
<ContentTemplate>
<asp:ListView> .... </asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="updatePro" DynamicLayout="true" runat="server" AssociatedUpdatePanelID="update">
<ProgressTemplate>
<asp:Image ImageUrl="~/App_Theme/ajax_loader_circle.gif" runat="server" ID="waitsymbol" />
</ProgressTemplate>
</asp:UpdateProgress>
<hr />
</div>
</form>
</body>
</html>

First place your listview aspx code inside an update panel
<asp:UpdatePanel ID="up" runat="server">
<ContentTemplate>
// Place your list View Code here
<asp:ListView ..........
...... </asp:ListView>
</ContentTemplate>
<Triggers>
// If button is present outside update panel then specify AsynPostBackTrigger
<asp:AsyncPostBackTrigger ControlID="btnControlID" EventName="Click" />
</Triggers>
</asp:UpdatePanel>
// Now Set AssociatedUpdatePanelID="up" in the UpdateProgress
<asp:UpdateProgress ID="UpdateProgress1" DynamicLayout="true" runat="server" AssociatedUpdatePanelID="up" >
<ProgressTemplate>
<div class="progress">
<img src="images/ajax-loader-arrows.gif" /> please wait...
</div>
</ProgressTemplate>
</asp:UpdateProgress>

Try to put your button within an UpdatePanel that contains the code may take a long time to execution, then associate the UpdateProgress control to the UpdatePanel. Code you may need is just like:
<asp:UpdatePanel ID="updatePanelMain" runat="server">
<ContentTemplate>
<asp:button runat="server" ID="btnBenutzerSuchen" OnClick="btnBenutzerSuchen_Click"/>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updatePanelMain" DisplayAfter="200">
<ProgressTemplate>
<div class="progress">
<img src="images/ajax-loader-arrows.gif" /> please wait...
</div>
</ProgressTemplate>
</asp:UpdateProgress>

I did a small example simulation a button click within an updatePanel. Pay attention to the attribute AssociatedUpdatePanelID which must be set, in order to show your progressTemplate.
default.aspx
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btnDoSomething" runat="server" Text="Do Something"
onclick="btnDoSomething_Click" />
<asp:ListView> YOUR_LISTVIEW_GOES_HERE </asp:ListView>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdateProgress ID="UpdateProgress1" DynamicLayout="true" runat="server"
AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<div class="progress">
<img src="images/ajax-loader-arrows.gif" /> please wait...
</div>
</ProgressTemplate>
</asp:UpdateProgress>
default.aspx.cs
protected void btnDoSomething_Click(object sender, EventArgs e)
{
System.Threading.Thread.Sleep(5000);
// or update listView
}

Show Progress Bar Using UpdateProgress Control in Asp.net
Refer This Link for more information
http://www.freshcodehub.com/Article/22/show-progress-bar-using-updateprogress-control-in-aspnet
<asp:UpdateProgress ID="prgLoadingStatus" runat="server" DynamicLayout="true">
<ProgressTemplate>
<div id="overlay">
<div id="modalprogress">
<div id="theprogress">
<asp:Image ID="imgWaitIcon" runat="server" ImageAlign="AbsMiddle" ImageUrl="~/img/progress.gif"
Width="230px" /><br />
Please wait...
</div>
</div>
</div>
</ProgressTemplate>
</asp:UpdateProgress>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Button ID="btnProgress" runat="server" Text="Show Progress" OnClick="btnProgress_Click" />
</ContentTemplate>
</asp:UpdatePanel>