This is a cool example of how to return the results of a search formatted as a Gridview using the jQuery ajaxForm method.
Here is a working example
>> jquery.contact.form.response.aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Form</title>
<script type="text/javascript" src="jquery/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="jquery/jquery.form.js"></script>
<script type="text/javascript">
// prepare the form when the DOM is ready
$(document).ready(function() {
// bind form using ajaxForm
$('#htmlForm').ajaxForm({
// target identifies the element(s) to update with the server response
target: '#htmlExampleTarget',
// success identifies the function to invoke when the server response
// has been received; here we apply a fade-in effect to the new content
success: function() {
$('#htmlExampleTarget').fadeIn('5000');
}
});
});
</script>
</head>
<body>
<form id="htmlForm" action="jquery.contact.form.response.gridview.aspx" method="post">
Movie Search: <input type="text" name="title" value="Truth" />
<input type="submit" value="Search Movies" />
</form>
Suggestions: "truth","attack","an","space"<br /><br />
<div id="htmlExampleTarget"></div>
</body>
</html>
>> jquery.contact.form.response.gridview.aspx
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<script runat="server">
Sub Page_Load()
If Not Page.IsPostBack Then
Dim strTitle As String = Request("title")
lblTitle.Text = strTitle
BindGridView(strTitle, "Title")
End If
End Sub
Sub BindGridView(ByVal strTitle As String, ByVal strSortOrder As String)
Dim con As New SqlConnection(ConfigurationManager.ConnectionStrings("MyDatabase").ConnectionString)
Dim strSqlText As String = "SELECT Title, Director FROM Movies WHERE Title LIKE '%" & strTitle & "%' ORDER BY " & strSortOrder
Dim cmd As New SqlCommand(strSqlText)
con.Open()
cmd.Connection = con
dgMovies.DataSource = cmd.ExecuteReader(CommandBehavior.CloseConnection)
dgMovies.DataBind()
con.Close()
con.Dispose()
End Sub
Sub SortGridView(ByVal Sender As Object, ByVal e As GridViewSortEventArgs)
BindGridView(lblTitle.Text, e.SortExpression.ToString())
End Sub
</script>
<html>
<head><title></title>
</head>
<body>
<form runat="server">
<asp:gridview runat="server" CellPadding="4"
ForeColor="#333333" GridLines="None"
AllowSorting="true" OnSorting="SortGridView"
id="dgMovies" Width="80%"
HorizontalAlign="Center"
Font-Names="Tahoma"
Font-Size="Small"
EmptyDataText="No records were found">
<RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
<SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
<HeaderStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
<AlternatingRowStyle BackColor="White" ForeColor="#284775" />
</asp:gridview>
<asp:Label ID="lblTitle" runat="server" Visible="false" />
</form>
</body>
</html>