I'm planning for auto complete like fb drop down...
So 1st I have make to upload the image to DB
Next Page to search on the text box and it fetches based on the image name also but in the auto complete image is not being displayed Pls help on it...
Upload Image Aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Save Images In Folder and Display Images in Gridview from folder</title>
<style type="text/css">
.Gridview
{
font-family:Verdana;
font-size:10pt;
font-weight:normal;
color:black;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:FileUpload ID="fileuploadimages" runat="server" />
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" onclick="btnSubmit_Click" />
</div>
<div>
</div>
</form>
</body>
</html>
Upload CS File
using System;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void btnSubmit_Click(object sender, EventArgs e)
{
string filename = Path.GetFileName(fileuploadimages.PostedFile.FileName);
fileuploadimages.SaveAs(Server.MapPath("Images/"+filename));
SqlConnection con = new SqlConnection(ConfigurationManager.ConnectionStrings["dbconnection"].ToString());
con.Open();
SqlCommand cmd = new SqlCommand("Insert into ImagesPath(ImageName,ImagePath) values(@ImageName,@ImagePath)", con);
cmd.Parameters.AddWithValue("@ImageName", filename);
cmd.Parameters.AddWithValue("@ImagePath", "Images/" + filename);
cmd.ExecuteNonQuery();
con.Close();
Response.Redirect("~/Default.aspx");
}
}
Search Aspx
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<link href="css/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<script src="scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#<%=txtSearch.ClientID%>").autocomplete("Search.ashx", {
width: 200,
formatItem: function (data, i, n, value) {
return "<img style = 'width:50px;height:50px' src='Images/" + value.split(",")[1] + "'/> " + value.split(",")[0];
},
formatResult: function (data, value) {
return value.split(",")[0];
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="txtSearch" runat="server" Width = "195"></asp:TextBox>
</div>
</form>
</body>
</html>
Generic Handler
using System;
using System.Data.SqlClient;
using System.Text;
using System.Web;
public class Search : IHttpHandler {
public void ProcessRequest (HttpContext context)
{
string searchText = context.Request.QueryString["q"];
SqlConnection con = new SqlConnection("Data Source=RG1WIN2008R2\\SQLEXPRESS;Initial Catalog=vig_task1;Persist Security Info=True;User ID=sa;Password=Rage@2012");
con.Open();
SqlCommand cmd = new SqlCommand("select ImageName from ImagesPath where ImageName Like @Search + '%'", con);
cmd.Parameters.AddWithValue("@Search",searchText);
StringBuilder sb = new StringBuilder();
using(SqlDataReader dr=cmd.ExecuteReader())
{
while(dr.Read())
{
sb.Append(string.Format("{0}",dr["ImageName"],Environment.NewLine));
}
}
con.Close();
context.Response.Write(sb.ToString());
}
public bool IsReusable
{
get
{
return false;
}
}
}