Hi SajidHussa,
Refer below sample.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
body
{
font-family: Arial;
font-size: 10pt;
}
#dvPreview
{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=image);
min-height: 450px;
min-width: 450px;
display: none;
}
img
{
height: 350px;
width: 350px;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(function () {
$("#fileupload").change(function () {
$("#dvPreview").html("");
var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.jpg|.jpeg|.gif|.png|.bmp)$/;
if (regex.test($(this).val().toLowerCase())) {
if ($.browser.msie && parseFloat(jQuery.browser.version) <= 9.0) {
$("#dvPreview").show();
$("#dvPreview")[0].filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = $(this).val();
}
else {
if (typeof (FileReader) != "undefined") {
$("#dvPreview").show();
$("#dvPreview").append("<img />");
var reader = new FileReader();
reader.onload = function (e) {
$("#dvPreview img").attr("src", e.target.result);
}
reader.readAsDataURL($(this)[0].files[0]);
var img = $("#fileupload").get(0);
var files = img.files;
var data = new FormData();
for (var i = 0; i < files.length; i++) {
data.append(files[i].name, files[i]);
}
$.ajax({
type: 'POST',
data: data,
url: "Handler.ashx",
cache: false,
contentType: false,
processData: false,
success: function (r) {
alert(r.d);
},
error: function (r) {
alert(r.d);
}
});
} else {
alert("This browser does not support FileReader.");
}
}
} else {
alert("Please upload a valid image file.");
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="fileupload" type="file" />
<hr />
<b>Live Preview</b><br /><br />
<div id="dvPreview"></div>
</div>
</form>
</body>
</html>
Code
C#
HandlerCS.ashx
public void ProcessRequest(HttpContext context)
{
if (context.Request.Files.Count > 0)
{
HttpPostedFile postedFile = context.Request.Files[0];
string folderPath = context.Server.MapPath("~/Uploads/");
string fileName = System.IO.Path.GetFileName(postedFile.FileName);
postedFile.SaveAs(folderPath + fileName);
string filPath = folderPath + fileName;
string constr = System.Configuration.ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
using (System.Data.SqlClient.SqlConnection con = new System.Data.SqlClient.SqlConnection(constr))
{
using (System.Data.SqlClient.SqlCommand cmd = new System.Data.SqlClient.SqlCommand("INSERT INTO tblfilePath VALUE(@Path)", con))
{
cmd.Parameters.AddWithValue("@Path", filPath);
con.Open();
cmd.ExecuteNonQuery();
con.Close();
}
}
}
}
public bool IsReusable
{
get
{
return false;
}
}
VB.Net
HandlerVB.ashx
Public Sub ProcessRequest(ByVal context As HttpContext) Implements IHttpHandler.ProcessRequest
If context.Request.Files.Count > 0 Then
Dim postedFile As HttpPostedFile = context.Request.Files(0)
Dim folderPath As String = context.Server.MapPath("~/Uploads/")
Dim fileName As String = System.IO.Path.GetFileName(postedFile.FileName)
postedFile.SaveAs(folderPath & fileName)
Dim filPath As String = folderPath & fileName
Dim constr As String = System.Configuration.ConfigurationManager.ConnectionStrings("constr").ConnectionString
Using con As System.Data.SqlClient.SqlConnection = New System.Data.SqlClient.SqlConnection(constr)
Using cmd As System.Data.SqlClient.SqlCommand = New System.Data.SqlClient.SqlCommand("INSERT INTO tblfilePath VALUE(@Path)", con)
cmd.Parameters.AddWithValue("@Path", filPath)
con.Open()
cmd.ExecuteNonQuery()
con.Close()
End Using
End Using
End If
End Sub
Public ReadOnly Property IsReusable As Boolean
Get
Return False
End Get
End Property
Screenshot
