Tag Archives: UpdatePanel

UpdatePanel

[RESOLVED]specific need for tutorial or examples of java script in web forms.

I have a specific need to learn the best way to include java script in ASP.net WEB FORM pages.

I have already performed the obvious script calls using the Client Register StartUp script and experience with passing session values to java script functions.

I am looking for tutorials with more elaborate uses of a .js file that basically populates java script page content within a web form.

Any links or tutorials would be greatly appreciated. My search has gone on for a few days now, and nothing seems to fit my needs. There just doesn’t seem to be a great deal of material.

One example of the requirement is the use of the client side index DB to transfer blocks of data, rather than constant postbacks as is so common with ASP.net when displaying records synchronously.

It sounds like you are looking into using AJAX to make requests, as these will allow you to access information from your server-side code (such as Session values) from your client-side Javascript code.

An example of using this that involved jQuery might look like the following example.

I suppose you could define two WebMethods within your Example.aspx page and then make AJAX Requests to either set or retrieve the value from the Session :

[WebMethod]
public static string GetSessionValue(string key)
{
     return Session[key];
}

[WebMethod]
public static string SetSessionValue(string key, string valueToStore)
{
     Session[key] = valueToStore;
}

This way if you needed to retrieve a Session key through AJAX, you could use :

$.ajax({
            type: "POST",
            url: "Example.aspx/GetSessionValue",
            data: '{ key: "YourSessionKey" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data) {
                  // Grab your Session value here
                  alert("The Session value for YourSessionKey is " + data);
            }
});

or if you needed to set one :

$.ajax({
            type: "POST",
            url: "Example.aspx/GetSessionValue",
            data: '{ key: "YourSessionKey", valueToStore: "Example" }',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data) {
                  alert("The Session value for YourSessionKey has been set!");
            }
});

You could define areas within this same scripts and instead of performing an alert, you could set the value for a particular field :

success: function(data) {
        $("#IDOfYourControl").val(data);
}

You can find some additional AJAX and Javascript related tutorials / walkthroughs below :

It’s best to have a reasonable understand of Javascript if you are planning on using AJAX directly, although there are several different ways to get around this (using the jQuery framework for instance greatly simplifies
this process
) or by using a series of AJAX-based Controls like the AJAX Control Toolkit which automate much of the process for you, but only for certain tasks.

You can use many of the resources listed below if you want to get more familiar with Javascript or with other associated technologies :

Thanks Rion,

I have seen many of your posts and appreciate your feedback. But I think I wasn’t clear enough in my sample. A key factor in the process I am working on is that I would like to display a chart or graph or map.

I set this up with AJAX and it works, but because of the amount of data, the postbacks flicker and there are large amounts of data being transferred, all within the .net aspx environment.

In a php environment with javascript, the indexDB is populated and the chart or graph refreshes from the local PC rather than a postback. The initial download may pull down 1000 records, then after playing back 750, the next 1000 are retrieved. In this instance
we are playing back recorded data at a 1 second interval, that may have been record in 100 millisecond interval. Both of these values may change by user selection or based on the recorded data was captured.

The same logic might apply to a Google map as a marker travels a recorded route and plots the path of the route taken on the map.

Again, I have this working in an ASP environment, its the Postback refresh that is killing the visual.

I am hoping to learn more about how to take advantage of the indexDB with asp.net.

Hi,

Maybe this is because you are trying to search that in conjonction with ASP.NET? When you are client side the server side technology doesn’t matter much. So for example something like
http://www.html5rocks.com/en/tutorials/indexeddb/todo/ doesn’t deal at all with that. You can even  do ajax request etc… and you end up in the ASP.NET land only when you’ll deal with providing
the server side endpoints for those AJAX calls…

So here it seems you should just focus on how to use indexDB (which is unrelated to using PHP, ASP, ASP.NET or whatever server side).

The current situation is a bit confusing. It seems you have done something like this previously with PHP or that you "set this up with AJAX and it works" but still you have "postbacks flicker" ??? Do you actually SEE postbacks? Could it be for example rather
a graphic rendering issue or whatever?

If you’re talking about postbacks and flickering it sounds like you’re not using ajax after all.  Are you doing this via your own javascript or via an update panel?

I agree with Aidy.

One of the major benefits of AJAX requests is that you shouldn’t be seeing any PostBacks occur (that are related to your AJAX calls). Otherwise, it would simply be a page that is just refreshed every x seconds and uses the same data store to persist
the previous data between postbacks.

Another consideration, which might just be a shot in the dark, but it sounds like a system like yours may be able to benefit from a real-time technology like
SignalR, which could handle graphically mapping your results in real-time and presenting them to the user. Brij has a
very basic example demonstrating this functionality here that could be worth reading.
Ravi Kiran has another more detailed article with SignalR real-time charting using the popular d3.js library as well.

Thanks for the feedback I’ll check these out. FYI the dataset is 5000 records with 400 parameters per record.

Not ideal, and foolish IMHO for web analysis. a sub set would be much more practical. I have reviewed SignalR extensively, currently our platform does not support it, primarily on the data collection side.

AidyF Its an update panel.

The issue is fully related to the volume of data transfer and the javascript refresh and graph and map renderings. The javascript solution works well but it is static test data not live.

An updatepanel isn’t going to perform as well an ajax call to a webservice or similar, if you’re having performance issues I’d look to re-architect it away from updatepanels and onto custom javascript.

Thanks for you input.

Note that is the gist of the original post, and the link you provided is one I spent much time reviewing. I was hoping that there was some sort of ASP.net integration of the indexDB that I could glean for design ideas.

thanks again, it always helps to bounce ideas off of others.

[RESOLVED]How to check the element of a control which is inside a grid using javascript

Hi guys,

I have a grid in which  in which first cell is check box 2nd is drop down 3 rd  cell have radio button  and 4th cell have label

Now condition is that if fisrt check box than check if  radio box is checked then value of selected item from drop down should get appended with 

the label which is in 4th cell.

How to do it 

You can try with the below implemenation

HTML:

<asp:UpdatePanel runat="server">
            <ContentTemplate>
                <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" AllowSorting="True"
                    DataSourceID="SqlDataSource1" OnRowDataBound="GridView1_OnRowDataBound" OnSelectedIndexChanged="GridView1_SelectedIndexChanged">
                    <Columns>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:CheckBox ID="CheckBox2" runat="server" AutoPostBack="True" OnCheckedChanged="CheckBox2_CheckedChanged" />
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SqlDataSource1"
                                    DataTextField="AddressLine1" DataValueField="AddressLine1">
                                </asp:DropDownList>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:RadioButton ID="RadioButton1" runat="server" />
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>
                <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:AdventureWorks2008R2ConnectionString %>"
                    SelectCommand="SELECT top 20  [AddressID], [AddressLine1] FROM Person.Address">
                </asp:SqlDataSource>
            </ContentTemplate>
        </asp:UpdatePanel>

C#:

/// <summary>
        /// Handles the CheckedChanged event of the CheckBox2 control.
        /// </summary>
        /// <param name="sender">The source of the event.</param>
        /// <param name="e">The <see cref="EventArgs"/> instance containing the event data.</param>
        protected void CheckBox2_CheckedChanged(object sender, EventArgs e)
        {
            //Get the checkbox from sender object
            CheckBox chk = sender as CheckBox;
            //Get the selected row from checkbox container
            GridViewRow row = (GridViewRow)chk.NamingContainer;
            //Get the dropdownlist control from selected GridViewrow
            DropDownList drpdwctrl = row.FindControl("DropDownList1") as DropDownList;
            //Get the Radiobutton control from selected GridViewrow
            RadioButton rdpbtnctrl = row.FindControl("RadioButton1") as RadioButton;
            //Get the label control from selected GridViewrow
            Label lblctrl = row.FindControl("Label3") as Label;
            //Check if checkbox is checked or not
            if (chk.Checked)
            {
                //Check if Radiobutton control is checked or not
                if (rdpbtnctrl.Checked)
                {
                    //Assign the value to existing text in label control
                    lblctrl.Text = lblctrl.Text + " " + drpdwctrl.SelectedItem.Text;
                }
            }

        }

Change the ids of control as per your gridview

Rendered Output

EDIT:Added Rendred output demo

Hi kaushiklotus,

Thanks for your post.

Based on your requirement, I create a sample for you, you could refer to it and make some changes according to your specific requirements.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="../../../Scripts/jquery-1.8.2.js"></script>
    <script>
        $(function () {
            $(":checkbox").change(function () {
                var ischecked = $(this).is(":checked");
                var rd = $(this).parent().siblings().find(":radio").is(":checked");

                if (ischecked && rd) {
                    var mes = $(this).parent().siblings().find("select").find("option:selected").val();
                    //alert(mes);
                    $(this).parent().siblings().find("span").html(mes);
                }
            });

            $(":radio").change(function () {
                var ischecked = $(this).is(":checked");
                var rd = $(this).parent().siblings().find(":checkbox").is(":checked");

                if (ischecked && rd) {
                    var mes = $(this).parent().siblings().find("select").find("option:selected").val();
                    //alert(mes);
                    $(this).parent().siblings().find("span").html(mes);
                }
            });

            $("select").change(function () {
                var mes = $(this).find("option:selected").val();
                var ischecked = $(this).parent().siblings().find(":checkbox").is(":checked");
                var rd = $(this).parent().siblings().find(":radio").is(":checked");

                if (ischecked && rd) {
                    $(this).parent().siblings().find("span").html(mes);
                }
            });
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
                <Columns>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:CheckBox ID="CheckBox1" runat="server" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:DropDownList ID="DropDownList1" runat="server" DataSourceID="SqlDataSource1"
                                DataTextField="Name" DataValueField="Name">
                            </asp:DropDownList>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:RadioButton ID="RadioButton1" runat="server" />
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField>
                        <ItemTemplate>
                            <asp:Label ID="Label3" runat="server" Text="Label"></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
            <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ConnectionString %>" SelectCommand="SELECT * FROM [ChartInfo]"></asp:SqlDataSource>
        </div>
    </form>
</body>
</html> 

In above sample code, I use some selectors and events, if you’d like to learn about these, you could check the following links.

If you have any question about my reply, please let me know freely.

Best Regards,

Fei Han

Thank you 

Hi kaushiklotus.

Have you tried my sample? your requirement is that checking the elements inside a gridview using javascript, does my sample not meet your requirement?

Best Regards,

Fei Han

[RESOLVED]java script function not working after page postback

I am using JavaScript function

and i am using ajax update panel

when the page is post back JavaScript function is not working properly

My code is

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" Runat="Server">
 <link rel="stylesheet" href='<%= Page.ResolveUrl("~/Styles/bootstrap-datetimepicker.min.css") %>'/>
<asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
    <ContentTemplate>

<asp:LinkButton ID="LinkbtnReset" 
            runat="server" 
            CssClass="btn btn-primary" onclick="LinkbtnReset_Click">
    <span class="glyphicon glyphicon-refresh"></span> Reset
</asp:LinkButton>

<div class="form-group">

         
         
            <label class="control-label col-md-2 col-xs-12 col-sm-3" for="confirmPassword">Ref No:</label>
            
            <div class="col-xs-12 col-md-2 col-sm-3">
                 <asp:TextBox ID="txtRefNo" CssClass="form-control" runat="server"></asp:TextBox>
            </div>
            <label class="control-label col-xs-12 col-md-1 col-sm-3" for="confirmPassword">Ref Date:</label>
            <div class="col-xs-12 col-md-2 col-sm-3">
                <div class="input-group date form_date " data-date="" data-date-format="dd-M-yyyy" data-link-field="dtp_input2" data-link-format="yyyy-mm-dd">
                    <asp:TextBox ID="txtRefDate" CssClass="form-control" runat="server"></asp:TextBox>                   
					<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>
                </div>
				<input type="hidden" id="dtp_input2" value="" />
            </div>
         </div>
 </ContentTemplate>
    </asp:UpdatePanel>
    <!-- Script for DatePicker -->
     <script type="text/javascript" src='<%= Page.ResolveUrl("~/Scripts/bootstrap-datetimepicker.js")%>' charset="UTF-8"></script>
    <script type="text/javascript">
        
                $('.form_date').datetimepicker({
                    language: 'en',
                    weekStart: 1,
                    todayBtn: 1,
                    autoclose: 1,
                    todayHighlight: 1,
                    startView: 2,
                    minView: 2,
                    forceParse: 0
                });
          
   
   </script>


   <!-- End Script for datepicker -->
</asp:Content>

first time it is working fine

but when i click the Link button date picker is not working

i tried the following way but no use

protected void Page_PreInIt(object sender, EventArgs e)
    {
        string datescript;
        datescript = " <script type='text/javascript' src='../../Scripts/bootstrap-datetimepicker.js' charset='UTF-8'></script>";
        datescript = datescript + ("<script> $('.form_date').datetimepicker({language: 'en',weekStart: 1,todayBtn: 1,autoclose: 1,todayHighlight: 1,startView: 2,minView: 2,forceParse: 0});</script>");
        ClientScript.RegisterStartupScript(this.GetType(), "myScript", datescript, true);
    }

could anyone slove?

Thanks,

Murali.

Hi,

Try to add the datetimepicker from document ready event i.e.

$(document).ready(function(){
$('.form_date').datetimepicker({
                    language: 'en',
                    weekStart: 1,
                    todayBtn: 1,
                    autoclose: 1,
                    todayHighlight: 1,
                    startView: 2,
                    minView: 2,
                    forceParse: 0
                });
});

Hi Murali,

Thanks for your post.

murali krishna14

<script type="text/javascript">
        
                $('.form_date').datetimepicker({
                    language: 'en',
                    weekStart: 1,
                    todayBtn: 1,
                    autoclose: 1,
                    todayHighlight: 1,
                    startView: 2,
                    minView: 2,
                    forceParse: 0
                });
          
   
   </script>

Firstly, according to your code, are you sure that the datetimepicker works fine after the DOM has been initialized?

Besides, you could refer to the following code to execute your handler.

$(function () {
    $('.form_date').datetimepicker({
        language: 'en',
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        minView: 2,
        forceParse: 0
    });
})

Here is some example about Bootstrap datetimepicker, you could refer to it.

Best Regards,

Fei Han

[RESOLVED]page do not refresh in jquery.

hi,

i want that when i click on button.button event fire but page do not refresh. 

please help me out.

thanks for the help.

$( ".abc" ).click(function() {
         location.reload(true);
});

Hope this helps

Or this with ajax 

$(document).on("click", ".abc", function(){
          location.reload(true);
});

immaduddinahmed

i want that when i click on button.button event fire but page do not refresh. 

Have you considered using UpdatePanel, if not please try using that. 

Sample Code:

  <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:UpdatePanel ID="updpnl" runat="server">
            <ContentTemplate>
            <%--Your other controls here--%>
               <asp:Button ID="Button1" runat="server" Text="Button1" OnClick="Button1_Click" />
            </ContentTemplate>
        </asp:UpdatePanel>

C#:

/// <summary>
        /// Handles the Click event of the Button1 control.
        /// </summary>
        /// <param name="sender">The source of the event.</param>
        /// <param name="e">The <see cref="EventArgs"/> instance containing the event data.</param>
        protected void Button1_Click(object sender, EventArgs e)
        {
            //Logic to execute on button click
            
        }

Hi immaduddinah,

For your issue ,Here are my suggestion:

First, you can use ajax to achieve the asynchronous page refresh 

http://api.jquery.com/jquery.ajax/

When you click the button,you can call the ajax to fire a request to the  server side.

Second,just like  A2H mentioned ,you can use UpdataPanel to  achieve your goal:

http://www.asp.net/AJAX/documentation/live/tutorials/IntroductionUpdatePanel.aspx
http://ajax.net-tutorials.com/controls/updatepanel-control/

 

Best Regards,

Kevin Shen.

[RESOLVED]Execute JQuery After Postback

Hey, I’m trying to run a simple jquery script. I’ve got it working without a postback but I want to be able to click a linkbutton, have a postback and then have the jquery execute.

Here’s the script for context:

$(document).ready(function () {
    $("[id$=lnkRemove]").click(function () {
        $dataribbon = $(".ribbon-content");
        $dataribbon.delay(500).slideDown(500).delay(2500).slideUp(500);
    });
});

I’ve read about ScriptManager and it has this that could be useful:

ScriptManager.RegisterStartupScript

I’m not entirely sure how that works and other than that, there doesn’t seem to be a lot of resources for running javascript/jquery after a postback. I’ve also read a bit about UpdatePanels and partial postbacks. Can anyone tell me the best way to approach
this?

Make your js code a normal function

function myFunction() {
    $("[id$=lnkRemove]").click(function () {
        $dataribbon = $(".ribbon-content");
        $dataribbon.delay(500).slideDown(500).delay(2500).slideUp(500);
    });
}

In the click event handler for your linkbutton, use RegisterStartupScript to write js to call the "myFunction" function.  Google for RegisterStartupScript for examples.

Hi FireVulpes,

Thanks for your post.

As for your problem, you could refer to the following sample to call a javascript function from server side.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script>
        function myFunction() {
            alert("Hello World");
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:LinkButton ID="btnok" runat="server" OnClick="btnok_Click">CallClientSideFunction</asp:LinkButton>
    </div>
    </form>
</body>
</html> 
protected void btnok_Click(object sender, EventArgs e)
{
    //your code
            
    ScriptManager.RegisterStartupScript(this, GetType(), "myFunction", "myFunction();", true);
}

If you have any question about this issue, please post back freely.

Best Regards,

Fei Han

[RESOLVED]Popup for Process

Hi,

I want to show popup box for process until the process is done from server.

Example: adding product from admin , so until process done i want to show popup on the middle of the page and user cannot click until process done.

Please, I need your suggestions and logic to achieve my scenario.

Appreciate for your Quick and Better response.

Hi smd_yasin,
Based on your post, you want to show a box as a processbar, and user cannot click until process done. If I understand correctly, you’d better to try my code as below.

<head runat="server">
    <title></title>
    <style type="text/css">
    .lblTxtCenter
         {
              text-align: center;
         }
    </style>
    <script type="text/javascript" src="/jquery/jquery.js"></script>
    <script type="text/javascript">
        //$(document).ready(function ()
        //{
        //    $("#Button1").click(function ()
        //    {
        //        $("#Button1").attr({ "Enable": "false" });
        //    })
        //})// this JQuery is used to disable Button1 until process done
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
     <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <div class="pro">
         <asp:UpdatePanel ID="UpdatePanel1" runat="server" Visible="False">
             <ContentTemplate>
                 <div style='width: 200px; background-color: Silver; height: 20px;'>
                     <asp:Label runat="server" ID="lbl" CssClass="lblTxtCenter"></asp:Label></div>
                 <asp:Timer ID="Timer1" runat="server" Interval="1000" OnTick="Timer1_Tick" Enabled="false">
                 </asp:Timer>
                 <br/>
             </ContentTemplate>
         </asp:UpdatePanel>
        </div>
         <asp:Button ID="Button1" runat="server" Text="Start" OnClick="Button1_Click" />
    </div>
    </form>
</body>
 protected void Button1_Click(object sender, EventArgs e)
        {
           UpdatePanel1.Visible = true;
           ThreadClass cl = new ThreadClass();
           cl.begin();
           Timer1.Enabled = true;
        }
        protected void Timer1_Tick(object sender, EventArgs e)
        {
          if (ThreadClass.present <= 100)
          {
             Button1.Enabled = false;//if you use JQuery function above ,you may annotate it
             lbl.Text = ThreadClass.present.ToString() + "%";
             lbl.BackColor = System.Drawing.Color.Red;
             lbl.Width = ThreadClass.present * 2;
          }
          if (ThreadClass.present == 100)
          {
             ThreadClass.present = 0;
             UpdatePanel1.Visible = false;
             Button1.Enabled = true;
             Timer1.Enabled = false;
          }
        }
        public class ThreadClass
        {
            public static int present;
            public ThreadClass(){}
            public void begin()
            {
               if (present == 0)
               {
                   lock (this)
                   {
                      Thread tr = new Thread(new ThreadStart(() =>
                         {
                           for (int i = 0; i <= 1000; i++)
                           {
                              present = 100 * i / 1000;//Calculate the percentage completed  
                              Thread.Sleep(10);
                           }
                         }));
                   tr.IsBackground = true;
                   tr.Start();
                   }
               }
            }
        }

If you have any concern about it, please feel free to let me know.
Best regards,
Aswecan

Hi Aswecan,

I’m very thankful, that you posted proper script.

pure Jquery and ajax cascading dropdown lists

Hi,

I’m trying to create 2 dropdown lists name: states and cities, states dropdown list gets its data from database and when a state is selected the other dropdown list shows the related cities of that state, it’s pretty simple, but I don’t want to use ajax
controls like ajax scriptmanager and updatepanel, I want to write it in jquery inside my aspx page.

Please help me on this.

Thanks in advance :) 

Hi,

First Load all jquery library

then use the below code

$.ajax({
        type: "POST",
        url: "/Global/GetState/",
        contentType: "application/json",              
        dataType: "json",
        success: function (state) {
        $("#stateDropdown").empty();
        $.each(state, function () {
            $("#stateDropdown").append($("<option>                                                      
               </option>").val(this['StateId']).html(this['StateName']));
        });
     }
  });


$( "#CityDropdown").change(function() {
  $.ajax({
        type: "POST",
        url: "/Global/GetCity/",
        data:{StateId: $( "#StateDropdown").val()},
        contentType: "application/json",              
        dataType: "json",
        success: function (city) {
        $("#CityDropdown").empty();
        $.each(city, function () {
            $("#CityDropdown").append($("<option>                                                      
               </option>").val(this['cityID']).html(this['CityName']));
        });
     }
  });
});

 

Displaying message while postback

Hi,

How can I display a message to the user while data control (e.g. Grigview, Formview) is populating from server ?

Thanks,

You’ll need to populate your gridview using ajax, updatepanel etc so the work can happen after the actual page has loaded, this lets you show a message until the ajax work has finished.  Or you can show a "please wait" page that redirects to your actual
page so the browser shows the waiting page until the actual page has returned from the server.

Hi shtrudel,

Thanks for your post.

The UpdateProgress control could provide status information about partial-page updates in UpdatePanel controls, and you can customize the default content and the layout of the UpdateProgress control. So you could use UpdateProgress control  to show that
an asynchronus method is working.

For more information about UpdateProgress Control, you could refer to the following link.

Besides, you could refer to this sample.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        #UpdatePanel1, #UpdateProgress1 {
            border-right: gray 1px solid;
            border-top: gray 1px solid;
            border-left: gray 1px solid;
            border-bottom: gray 1px solid;
        }

        #UpdatePanel1 {
            width: 200px;
            height: 200px;
            position: relative;
            float: left;
            margin-left: 10px;
            margin-top: 10px;
        }

        #UpdateProgress1 {
            width: 400px;
            background-color: #FFC080;
            bottom: 0%;
            left: 0px;
            position: absolute;
        }
    </style>


    <script runat="server">
        protected void Button_Click(object sender, EventArgs e)
        {
            System.Threading.Thread.Sleep(3000);
        }
    </script>

</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
        <div>
            <asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
                <ContentTemplate>
                    <%=DateTime.Now.ToString() %>
                    <br />
                    <asp:Button ID="Button1" runat="server" Text="Refresh Panel" OnClick="Button_Click" />
                </ContentTemplate>
            </asp:UpdatePanel>

            <asp:UpdateProgress ID="UpdateProgress1" runat="server">
                <ProgressTemplate>
                    Update in progress...
                </ProgressTemplate>
            </asp:UpdateProgress>

        </div>
    </form>
</body>
</html>

Hope it will be helpful to you.

Best Regards,

Fei Han

Thank you for your answers,

I prefer not to use the ajax controls… maybe because I do not really understand what’s behind the scene’s

shtrudel

I prefer not to use the ajax controls

You are going to have to use some kind of AJAX-enabled approach to do what you want. If you prefer not to use the AJAX controls, you can use jQuery.