HTML 5 support the Datalist Control. You can use a Datalist Contrl on your ASP.NET Page for a searchable TextBox.
Here I give an example of a searchable Textbox using jQuery / HTML 5.
Your .aspx page would be like:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DatalistHTML5.aspx.cs"
Inherits="testHTML5.DatalistHTML5" %>
<!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>Datalist HTML 5 Example</title>
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.4.1-vsdoc.js"></script>
<script language="javascript" type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$.post('DatalistHTML5.ashx', function (data) {
$('#student').html(data);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
Student Name: <input list="student" id="studentlist" runat="server"/>
<datalist id="student">
</datalist>
<br />
</div>
<asp:Button ID="btnsave" runat="server" onclick="btnsave_Click" Text="Save" />
</form>
</body>
</html>
Call the handler with the post method of jQuery
You Handler like would look like:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace testHTML5
{
/// <summary>
/// Summary description for DatalistHTML51
/// </summary>
public class DatalistHTML51 : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Clear();
context.Response.Write(BindStudentlist());
context.Response.End();
}
private string BindStudentlist()
{
//Use you Database logic .
System.Text.StringBuilder stdlist = new System.Text.StringBuilder();
stdlist.Append("<option value='Ajay'>");
stdlist.Append("<option value='Amit'>");
stdlist.Append("<option value='Binal'>");
stdlist.Append("<option value='Dilip'>");
stdlist.Append("<option value='Jayendra' >");
stdlist.Append("<option value='Jignesh' >");
stdlist.Append("<option value='Vinod'>");
return stdlist.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
}
Your .cs file Code
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace testHTML5
{
public partial class DatalistHTML5 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsCallback)
{
}
}
protected void btnsave_Click(object sender, EventArgs e)
{
string carvalue = Request.Form["studentlist"];
}
}
}