Partial view page for create,edit,delete in asp.net mvc4 - image

Question

How to upload the image in asp.net mvc4.images save in local folder,images path name save to database.

Answer 1

I would say use Valum's AJAX File Uploader
here is how I'd done that
[HttpGet]
public ActionResult PictureUpload()
{
return View();
}
[HttpPost]
public ActionResult PictureUpload( string qqfile)
{
var path = Server.MapPath("~/App_data/Files/");
var file = string.Empty;
try
{
var stream = Request.InputStream;
if (String.IsNullOrEmpty(Request["qqfile"]))
{
// IE
HttpPostedFileBase postedFile = Request.Files[0];
if (postedFile != null) stream = postedFile.InputStream;
file = Path.Combine(path, qqfile);
}
else
{
//Webkit, Mozilla
file = Path.Combine(path, qqfile);
}
var buffer = new byte[stream.Length];
stream.Read(buffer, 0, buffer.Length);
System.IO.File.WriteAllBytes(file, buffer);
}
catch (Exception ex)
{
return Json(new { success = false, message = ex.Message }, "application/json");
}
return Json(new { success = true }, "text/html");
}
**THIS GIVEN HTML and Javascript need uploaderjs file and css file from Valums website **
Index
<div id="file-uploader">
<noscript>
<p>Please enable JavaScript to use file uploader.</p>
<!-- or put a simple form for upload here -->
</noscript>
</div>
<script src="~/Scripts/fileuploader.js"></script>
<script type="text/javascript">
var uploader = new qq.FileUploader({
// pass the dom node (ex. $(selector)[0] for jQuery users)
element: document.getElementById('file-uploader'),
// path to server-side upload script
action: '/FileUpload/File',
onComplete: function(data) {
alert(data);
},
});
</script>
Hope this will help