ASP.NET Ajax Database Programming
Ajax introduces a new approach to WebPages that update the portion of a page by a technique called Partial-page rendering. Partial-page rendering eliminate the traditional way of loading a full postback (full page refresh) to the web server and updates only the necessary portion of a web page.
The following asp.net program shows how to connect a database from an Asp.net Ajax application. In this program we placed a DropDownList and GridView inside the UpdatePanel control area and while selecting different items from DropDownList you can see the GridView is updating without full postback to the server. Also you can notice that the page load time and data updated time with the help of Label controls
Default.aspx
<!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>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server" >
<div>
<br />
<asp:Label ID="Label2" runat="server" Text="Label"></asp:Label>
<br /><br />
</div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true"
onselectedindexchanged="DropDownList1_SelectedIndexChanged">
</asp:DropDownList>
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Load Combo" />
<br />
<asp:GridView ID="GridView1" runat="server">
</asp:GridView>
<br />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Full Source | C#
using System;
using System.Data;
using System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{
SqlConnection cnn;
string sql = "";
string connetionString = null;
protected void Page_Load(object sender, EventArgs e)
{
connetionString = "Data Source=SERVERNAME;Initial Catalog=pubs;User ID=sa;Password=YOURPASSWORD";
cnn = new SqlConnection(connetionString);
Label2.Text = "Page loaded time : " + DateTime.Now.ToString();
}
protected void Button1_Click(object sender, EventArgs e)
{
loadCombo();
}
public void loadCombo()
{
try
{
cnn.Open();
sql = "select pub_id,pub_name from publishers";
SqlDataAdapter adapter = new SqlDataAdapter();
SqlCommand sqlCmd;
DataSet ds = new DataSet();
sqlCmd = new SqlCommand(sql, cnn);
adapter.SelectCommand = sqlCmd;
adapter.Fill(ds);
cnn.Close();
DropDownList1.DataTextField = "pub_name";
DropDownList1.DataValueField = "pub_id";
DropDownList1.DataSource = ds.Tables[0];
DropDownList1.DataBind();
}
catch (Exception ex)
{
Label1.Text = "Can not open connection ! " + ex.ToString();
}
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
string pubid = DropDownList1.SelectedValue;
sql = "select title,type,pubdate from titles where pub_id='" + pubid + "'";
cnn.Open();
SqlDataAdapter adapter = new SqlDataAdapter();
SqlCommand sqlCmd;
DataSet ds = new DataSet();
sqlCmd = new SqlCommand(sql, cnn);
adapter.SelectCommand = sqlCmd;
adapter.Fill(ds);
cnn.Close();
//Label1.Text = ds.Tables[0].Rows.Count.ToString();
GridView1.DataSource = ds.Tables[0];
GridView1.DataBind();
Label1.Text = "Last updated time : " + DateTime.Now.ToString();
}
}
Full Source | VB.NET
Imports System.Data
Imports System.Data.SqlClient
Partial Class _Default
Inherits System.Web.UI.Page
Dim cnn As SqlConnection
Dim sql As String = ""
Dim connetionString As String = Nothing
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
connetionString = "Data Source=SERVER-NAME;Initial Catalog=pubs;User ID=sa;Password=PASSWORD"
cnn = New SqlConnection(connetionString)
Label2.Text = "Page loaded time : " + DateTime.Now.ToString()
End Sub
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
loadCombo()
End Sub
Public Sub loadCombo()
Try
cnn.Open()
sql = "select pub_id,pub_name from publishers"
Dim adapter As New SqlDataAdapter()
Dim sqlCmd As SqlCommand
Dim ds As New DataSet()
sqlCmd = New SqlCommand(sql, cnn)
adapter.SelectCommand = sqlCmd
adapter.Fill(ds)
cnn.Close()
DropDownList1.DataTextField = "pub_name"
DropDownList1.DataValueField = "pub_id"
DropDownList1.DataSource = ds.Tables(0)
DropDownList1.DataBind()
Catch ex As Exception
Label1.Text = "Can not open connection ! " + ex.ToString()
End Try
End Sub
Protected Sub DropDownList1_SelectedIndexChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles DropDownList1.SelectedIndexChanged
Dim pubid As String = DropDownList1.SelectedValue
sql = "select title,type,pubdate from titles where pub_id='" + pubid + "'"
cnn.Open()
Dim adapter As New SqlDataAdapter()
Dim sqlCmd As SqlCommand
Dim ds As New DataSet()
sqlCmd = New SqlCommand(sql, cnn)
adapter.SelectCommand = sqlCmd
adapter.Fill(ds)
cnn.Close()
'Label1.Text = ds.Tables[0].Rows.Count.ToString();
GridView1.DataSource = ds.Tables(0)
GridView1.DataBind()
Label1.Text = "Last updated time : " + DateTime.Now.ToString()
End Sub
End Class
Click the following links to see full source code
C# Source Code
VB.NET Source Code
Related Topics
- What is Ajax
- How to ASP.NET Ajax
- ASP.NET Ajax ServerControls
- First Asp.Net Ajax Program
- ASP.NET Ajax UpdateProgress
- ASP.NET Ajax Timer
- ASP.NET Ajax Toolkit
- ASP.NET Ajax Accordion
- Ajax Accordion from database
- Ajax Accordion from XML
- Ajax AsyncFileUpload Control
- Ajax ConfirmButtonExtender
- Ajax CalendarExtender
- CalendarExtender Validation