Using JavaScript and UpdatePanels in VB.NET

This tutorial was created with Visual Studio.NET 2008. 2005 can be used, but Microsoft's ASP.NET AJAX Extensions, which can be downloaded at this link, must be installed.

Server Intellect assists companies of all sizes with their hosting needs by offering fully configured server solutions coupled with proactive server management services. Server Intellect specializes in providing complete internet-ready server solutions backed by their expert 24/365 proactive support team.

We all know that AJAX utilizes JavaScript, but what if we want to use our own JavaScript calls in conjunction with AJAX? This tutorial will show you how we can call JavaScript ourselves whilst using AJAX. We will be making use of the Alert method in JavaScript when the user clicks a button.
We will start off by creating our ASPX page with a ScriptManager and an UpdatePanel, as normal:

If you're ever in the market for some great Windows web hosting, try Server Intellect. We have been very pleased with their services and most importantly, technical support.

For this web application, we will need to add a textbox and a button:

Yes, it is possible to find a good web host. Sometimes it takes a while. After trying several, we went with Server Intellect and have been very happy. They are the most professional, customer service friendly and technically knowledgeable host we've found so far.

We add the current time to the UpdatePanel so we know when it refreshes.
Our button will call the following method when clicked:

Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!

The entire code-behind will look something like this:

hi ,

I am new to ajax and this site is very much helpful to learn about AJAX .

regards,

sashi

thanks. This site is very helpful to learn ajax

I don't think this is a better use of the updatepanel, because if you can't separate your UI and code then you might be making mistake or overlooking something. I would suggest to not include UI in the code behind and if anyone does than you might be end with a code which is hard to manage. Sorry for the negative comment but this is what I feel when come to this kind of code which will make everyone's life miserable except the one who is writing.

What about if I want to add onclick attribute to a button inside update panel !

Another alternative way is to use the RegisterDataItem. Please see the following code..

ASPX code

---------

<script type="text/javascript">

Sys.WebForms.PageRequestManager.getInstance().add_pageLoading(

function (sender, args)

{

try

{

// Retrieve the data item

var data = args.get_dataItems()['<%= lblDataItem.ClientID %>'];

if(data)

{

alert('Hi, ' + data.userName + 'This is a JavaScript call within an UpdatePanel.')

}

}

catch(e)

{

alert(e.description)

}

}

);

</script>

<asp:Label ID="lblDataItem" runat="server"></asp:Label>

ASPX.cs code

---------

protected void btnButton_Click(object sender, EventArgs e)

{

ScriptManager.GetCurrent(this).RegisterDataItem(lblDataItem, "dataItem = { userName:'yourName' }", true);

}