UpdatePanel Control in

20/04/2019 UpdatePanel Control in ASP.
Net
In Focus
C#IsCorner Named a leader in the
Look Who Speaking at #CSharpCon19
Apigee API 2018 Gartner Magic
ASK A QUESTION
Management Quadrant. DownloadCONTRIBUTE
the
report today.
UpdatePanel Control in ASP.Net

This article describes how to add partial page update support to a web page using two
Mircosoft Ajax server controls, the ScriptManager Control and the UpdatePanel Control.
Pankaj Lohani Dec 07 2018
3 0 110.2k
Download Free .NET & JAVA Files API
Introduction
This article describes how to add partial page update support to a web page by using two
Microsoft Ajax server controls the ScriptManager Control and the UpdatePanel Control. Using
UpdatePanel control we can refresh only required part of the page instead of whole page.
ScriptManager Control
The ScripManager Control manages the partial page updates for UpdatPanel controls that are
on the ASP.NET web page or inside a user control on the web page. This control manages the
client script for AJAX-enabled ASP.NET web page and ScripManager control support the
feature as partial-page rendering and web-service calls.
https://www.c-sharpcorner.com/UploadFile/f50501/use-updatepanel-control-in-Asp-Net/ 1/11
20/04/2019 UpdatePanel Control in ASP.Net
In Focus
C#IsCorner
ASK A QUESTION CONTRIBUTE
UpdatePanel Control
You can refresh the selected part of the web page by using UpdatePanel control, Ajax
updatepanel control contains a two child tags that is ContentTemplate and Triggers. In a
ContenTemplate tag we used to place the user controls and the Trigger tag allows you to
de ne certain triggers which will make the panel update its content.
01. <asp:UpdatePanel ID="updatepnl" runat="server">

02. <ContentTemplate>
All the contents that must be updated asynchronously (only contenttemplate parts are
updated and rest of the web page part is untouched) are placed here. It allows us to send
request Or post data to server without submitting the whole page so that is called
asynchronous.
In Focus
C#IsCorner
Now I am going to show you how to check the availability of user name in database let's
follow the following steps:
Create DataBase and Table in Sql-Server
01. Create Database Employee

02. use Employee
03. create table UserDetails
04. (
05. UserName nvarchar(max)
06. )
Write the following procedure to insert the values in tables columns :
01. insert into UserDetails values('Pankaj')

02. insert into UserDetails values('Nimit')
Write the following query to execute the table schema:
01. select * from UserDetails
In Focus
C#IsCorner
Step 1
Open Visual Studio-->Create New Website-->ASP.NET Web Site
Step 2
Now go the solution explorer on to the right side of the application and do the following steps
gure given below.
In Focus
C#IsCorner
Step 3
Add new Web form in the empty web application gure given below.
Write the following code in a CheckAvailability.aspx page :
InStep
Focus4
C#IsCorner
01. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="CheckAvailability
02. <%@ Register Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"
03. <!DOCTYPE html>
04. <html xmlns="http://www.w3.org/1999/xhtml">
05. <head id="Head1" runat="server">
06. <title></title>
07. </head>
08. <body>
09. <form id="form1" runat="server">
10. <asp:ScriptManager ID="scriptmanager1" runat="server">
11. </asp:ScriptManager>
12. <div>
13. <asp:UpdatePanel ID="updatepnl" runat="server">
14. <ContentTemplate>
15. <table>
16. <tr>
17. <td>Enter UserName </td>
18. <td>:</td>
19. <td>
<asp:TextBox ID="txtun" runat="server" AutoPostBack="true" OnTextChanged=
</td>
20. <td>
21. <div id="checkun" runat="server" Visible="false">
22. <asp:Image ID="shwimg" runat="server" Width="17px" Height="17px"/>
23. <asp:Label ID="lblmsg" runat="server"></asp:Label>
24. </div>
25. </td>
26. </tr>
27. <tr>
28. <td>Enter Password </td>
29. <td>:</td>
30. <td><asp:TextBox ID="txpwd" runat="server" TextMode="Password">
</asp:TextBox></td>
31. </tr>
32. <tr>
33. <td>Enter Confirm Password </td>
34. <td>:</td>
35. <td><asp:TextBox ID="txtconpwd" runat="server" TextMode="Password">
</asp:TextBox></td>
36. </tr>
37. <tr>
38. <td colspan="3">
<asp:Button ID="txtbtn" Text="SUBMIT" runat="server" align="center" />
</td>
39. </tr>
40. </table>
41. </ContentTemplate>
42. </asp:UpdatePanel>
43. </div>
44. </form>
45. </body>
46. </html>
Now Write the following code in CheckAvailability.aspx.cs :
InStep
Focus5
C#IsCorner
01. using System;
02. using System.Collections.Generic;
03. using System.Linq;
04. using System.Web;
05. using System.Data;
06. using System.Data.SqlClient;
07. using System.Web.UI;
08. using System.Web.UI.WebControls;
09. public partial class CheckAvailability : System.Web.UI.Page
10. {
11. protected void Page_Load(object sender, EventArgs e)
12. {
13. }
14. protected void CheckUserNameAvailability(object sender, EventArgs e)
15. {
16. if (!string.IsNullOrEmpty(txtun.Text))
17. {
18. SqlConnection con = new SqlConnection("Data Source=MCNDESKTOP
19. con.Open();
20. SqlCommand cmd = new SqlCommand("select * from UserDetails wh
21. cmd.Parameters.AddWithValue("@un", txtun.Text);
22. SqlDataReader dr = cmd.ExecuteReader();
23. if (dr.HasRows)
24. {
25. checkun.Visible = true;
26. shwimg.ImageUrl = "Cancel.png";
27. lblmsg.Text = "UserName Already Exist..!!";
28. }
29. else
30. {
31. checkun.Visible = true;
32. shwimg.ImageUrl = "Accepted.png";
33. lblmsg.Text = "Congratulation created Successfully..!!";
34. }
35. }
36. else
37. {
38. checkun.Visible = false;
39. }
40. }
41. }
Step 6
Debug the application by press (F5) to execute Web form. After debugging the application
then the output would be as shown below.
In Focus
C#IsCorner
Step 7
Enter the User Name to check it is available in database or not, gure given below.
Step 8
Enter the User Name to check it is available in database or not, gure given below.
Summary
In this article you saw by using two Microsoft Ajax server controls the ScriptManager Control
and the UpdatePanel Control we can refresh only required part of the page instead of whole
page.
In Focus
C#IsCorner
ASP.NET ASP.NET Controls ScriptManager UpdatePanel Control
Pankaj Lohani
https://www.c-sharpcorner.com/members/pankaj-lohani2
251 1.2m
3 0
Type your comment here and press Enter Key (Minimum 10 characters)
OUR TRAINING
Become a Full Stack Web Developer

Learn web development with HTML, CSS, Bootstrap 4, React & Node.
In Focus
C#IsCorner
Holiday in Dubai
Get 3N/4D packages

starting a Rs.31,499 only.
TRENDING UP
01 Most Popular Front End JavaScript Framework In The World
02 Angular 7 Routing And Preserving Trailing Slash In URL⚔
03 Top 10 JavaScript Frameworks In The World
04 .NET Core For .NET Developers
05 Microservices Using ASP.NET Core
Implement CRUD Operations With Sorting, Searching And Paging Using EF Core In
06 ASP.NET Core
07 For Vs Foreach In C#
08 Building High Performance Back End (SQL Server)
09 All About C# Immutable Classes
10 How To Implement Authentication Using Identity Model In ASP.NET Core

View All
In Focus
C#IsCorner
Look Who Hotels in Mumbai
Speaking at #CSharpCon19
from 450
Book Now
Hotels in London
from 935
Book Now
Hotels in Bangkok
from 437
Book Now
About Us Contact Us Privacy Policy Terms Media Kit Sitemap Report a Bug FAQ Partners
C# Tutorials
©2019 C# Corner. All contents are copyright of their authors.

UpdatePanel Control in

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

UpdatePanel Control in

Uploaded by

Copyright:

Available Formats

20/04/2019 UpdatePanel Control in ASP.

UpdatePanel Control in ASP.Net

Pankaj Lohani Dec 07 2018

Download Free .NET & JAVA Files API

ASK A QUESTION CONTRIBUTE

01. <asp:UpdatePanel ID="updatepnl" runat="server">

ASK A QUESTION CONTRIBUTE

Create DataBase and Table in Sql-Server

01. Create Database Employee

Write the following procedure to insert the values in tables columns :

01. insert into UserDetails values('Pankaj')

Write the following query to execute the table schema:

01. select * from UserDetails

ASK A QUESTION CONTRIBUTE

Open Visual Studio-->Create New Website-->ASP.NET Web Site

ASK A QUESTION CONTRIBUTE

Write the following code in a CheckAvailability.aspx page :

Now Write the following code in CheckAvailability.aspx.cs :

ASK A QUESTION CONTRIBUTE

ASK A QUESTION CONTRIBUTE

ASP.NET ASP.NET Controls ScriptManager UpdatePanel Control

Become a Full Stack Web Developer

ASK A QUESTION CONTRIBUTE

Get 3N/4D packages

01 Most Popular Front End JavaScript Framework In The World

02 Angular 7 Routing And Preserving Trailing Slash In URL⚔

03 Top 10 JavaScript Frameworks In The World

04 .NET Core For .NET Developers

05 Microservices Using ASP.NET Core

08 Building High Performance Back End (SQL Server)

09 All About C# Immutable Classes

10 How To Implement Authentication Using Identity Model In ASP.NET Core

You might also like