Refresh in browser when uploading mvc file c # - c#

I have an AJAX file upload by call to MVC C# driver, but the browser refreshes and reloads the page.
But if I comment the line that saves the file in the driver does not happen that is only when the file is saved on the server. File.SaveAs (fname);
MVC controller:
[HttpPost]
public ActionResult UploadDocument()
{
if (Request.Files.Count > 0)
{
try
{
FileUpdateDto fileModal = new FileUpdateDto();
HttpFileCollectionBase files = Request.Files;
for (int i = 0; i < files.Count; i++)
{
HttpPostedFileBase file = files[i];
string fname;
DirectoryInfo directory = new DirectoryInfo(Server.MapPath("~/Content/Document/" + UserId).ToString());
if (!directory.Exists)
{
Directory.CreateDirectory(Server.MapPath("~/Content/Document/" + UserId).ToString());
}
if (Request.Browser.Browser.ToUpper() == "IE" || Request.Browser.Browser.ToUpper() == "INTERNETEXPLORER")
{
string[] testfiles = file.FileName.Split(new char[] { '\\' });
fname = testfiles[testfiles.Length - 1];
}
else
{
fname = file.FileName;
}
var guidnew = Guid.NewGuid();
fname = Path.Combine(Server.MapPath("~/Content/Document/" + UserId), guidnew + "." + fname.Split('.')[1].ToString());
fileModal.FileName = fname;
fileModal.Path = directory.ToString();
fileModal.DateFileUpload = DateTime.Now;
file.SaveAs(fname); // If I comment this line without refreshing the browser but does not save the file
}
return Json(fileModal);
}
catch (Exception ex)
{
return Json("Error occurred. Error details: " + ex.Message);
}
}
else
{
return Json("No files selected.");
}
}
Call Ajax in JavaScript:
UploadDocument: function () {
if (window.FormData !== undefined) {
var fileUpload = $("#AdviserFileUpload").get(0);
var files = fileUpload.files;
var fileData = new FormData();
for (var i = 0; i < files.length; i++) {
fileData.append(files[i].name, files[i]);
}
//fileData.append('username', 'Manas');
$.ajax({
url: site.baseUrl + '/Api/Upload/Document',
type: "POST",
contentType: false,
processData: false,
data: fileData,
success: function (result) {
__this._AdviserDocumentFile = result;
},
error: function (err) {
alert(err.statusText);
}
});
} else {
alert("FormData is not supported.");
}
}

I believe I found the solution. The cause is that Visual Studio's "Enable Reload on Save" property is True.
Go to Tools - Options - Web - Browser Reload on Save - Enable Reload on Save and make it false.
Im working with VS2015 and this worked for me, hope it works for you too.
Source

Related

how to allow file download in asp.net from dynamically generated table

I am using elasticsearch to query in index of PDFs on a asp.net mvc app. When I get the result I would like the user to be able to click the returned filename to download that file. Researching how to enable this functionality has returned plenty of results but none seem to work for me. I would simply like the user to be able to click on the filename and have the file download for them. I am using the below code.
To generate the dynamic table with search results
var row = $("<tr><th>" + "Search Results" + "</th><th>" + "File Name" + "</th>");
$("#myTable").append(row);
for (var i = 0; i < response.datasend.length; i++) {
var pos = response.datasend[i].Attachment.Content.indexOf(obj.searchterm);
var row = $("<tr><td>" + response.datasend[i].Attachment.Content.slice((pos - 100), (pos + 100)) + "</td><td><a href=# id=fileName>"
+ response.datasend[i].filename + "</a></td></tr>");
$("#myTable").append(row);
}
To detect the requested filename and call the function to start the download process
var table = document.getElementById("myTable");
table.addEventListener("click", function(e) {
if (e.target && e.target.id == "fileName")
{
var apiUrl = "/AllSearch/Download";
var obj = {};
obj.searchterm = e.target.innerHTML;
var params = e.target.innerHTML;
$.ajax({
contentType: 'application/json',
url: apiUrl,
dataType: "json",
data: {fileName: obj.searchterm},
success: function(data) {
alert("success");
},
error: function (xhr, err) {
alert("ready state: " + xhr.readyStat + " " + xhr.status);
}
});
}
});
To start download the file
public ActionResult Download(string fileName)
{
string filename = fileName;
string filePath = #"C:;at\to\file\Documents\" + fileName;
byte[] filedata = System.IO.File.ReadAllBytes(filePath);
string contentType = MimeMapping.GetMimeMapping(filePath);
var cd = new System.Net.Mime.ContentDisposition
{
FileName = filename,
Inline = true,
};
Response.AppendHeader("Content-Disposition", cd.ToString());
return File(filedata, contentType);
}
The Download function is from Returning a file to View/Download in ASP.NET MVC but it returns an error when I run it. Not sure what I am missing here. Any help is appreciated

FileDownload Not working ASP MVC

I'm trying to download a file from server but this thing won't work. Been tring doing it for more than 2 weeks. Here is the code:
IN CSHTML PAGE:
<script type="text/x-jsrender" id="docView">
View
</script>
<script>
function docView(id) {
docId = id;
$.ajax({
type: "GET",
url: '#Url.Action("DownloadFile", "Profile")' + "?docid=" + docId,
dataType: "json",
success: function (result) {
},
});
</script>
IN MVC Controller:
[HttpGet]
public ActionResult DownloadFile(Guid? docid)
{
int i = 1;
string key = ConfigurationManager.AppSettings["PhysicalDocumentPath"];
JApplicantDocument value = new JApplicantDocument();
var response = new Response();
var fName = "";
var savefileName = "";
var fileSavePath = "";
var prevPath = "";
var nextPath = "";
try
{
IApplicantDataService applicantDataService = new ApplicantDataService();
response = applicantDataService.GetDocument(docid, value);
var fileName = value.ApplicantId + "_" + value.DocumentName;
fName = fileName;
savefileName = fileName;
fileSavePath = Path.Combine(key, fileName);
prevPath = fileSavePath;
nextPath = fileSavePath;
var tmp = fileName.Split('.');
var tmp1 = tmp[0];
while (System.IO.File.Exists(nextPath)) //to get the latest file
{
tmp = fileName.Split('.');
fileName = tmp1 + i.ToString();
fileName = fileName + "." + tmp[1];
savefileName = fileName;
nextPath = Path.Combine(key, savefileName);
if (System.IO.File.Exists(nextPath))
{
prevPath = nextPath;
}
i++;
tmp = prevPath.Split(new string[] { "Docs\\" }, StringSplitOptions.None);
fName = tmp[1];
response.Message = prevPath;
}
}
catch (Exception e)
{
Utils.Write(e);
}
return File(prevPath, value.Format);
}
I just want on click of View button to download the file as per this(http://www.c-sharpcorner.com/UploadFile/db2972/file-download-sample-in-mvc-day-40/). i cannot use location.href(...) directly in tag due to the fact that i'm using it in script jsrender which is being used in syncfusion grid controls. Hence I wont be able to get the docid at all.

how to post a file with a paramater in AngularJS and webApi

I want to post a file with a parameter to a web Api function,I am able to save the file to a Directory on the server when I remove the parameter but with the parameter the post the method is not call
this is the angularJs
// this will get the upload from the html
$scope.getFileDetails = function (e)
{
$scope.files = [];
$scope.$apply(function ()
{
// STORE THE FILE OBJECT IN AN ARRAY.
for (var i = 0; i < e.files.length; i++)
{
$scope.files.push(e.files[i])
}
});
};
//the file array
$scope.uploadFiles = function()
{
//FILL FormData WITH FILE DETAILS.
var data = new FormData();
for (var i in $scope.files)
{
data.append("uploadedFile", $scope.files[i]);
}
// ADD LISTENERS.
var objXhr = new XMLHttpRequest();
objXhr.addEventListener("progress", updateProgress, false);
objXhr.addEventListener("load", transferComplete, false);
var empID="PC145"
// SEND FILE DETAILS TO THE API.
objXhr.open("POST", "/api/Logo/"+empID); // this is not working
objXhr.send(data);
}
this is the web Api method
public string UploadFiles(String empid)
{
int iUploadedCnt = 0;
String na = empid;
// DEFINE THE PATH WHERE WE WANT TO SAVE THE FILES.
string sPath = "";
sPath = System.Web.Hosting.HostingEnvironment.MapPath("~/Logo/");
System.Web.HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files;
// CHECK THE FILE COUNT.
for (int iCnt = 0; iCnt <= hfc.Count - 1; iCnt++)
{
System.Web.HttpPostedFile hpf = hfc[iCnt];
String fileName = sPath + Path.GetFileName(hpf.FileName);
String fileNameDB = Path.GetFileName(hpf.FileName);
this.FileName = fileNameDB;
if (hpf.ContentLength > 0)
{
// CHECK IF THE SELECTED FILE(S) ALREADY EXISTS IN FOLDER. (AVOID DUPLICATE)
if (!File.Exists(fileName))
{
// SAVE THE FILES IN THE FOLDER.
hpf.SaveAs(fileName);
insertLogo(fileNameDB);
iUploadedCnt = iUploadedCnt + 1;
}
}
}
// RETURN A MESSAGE (OPTIONAL).
if (iUploadedCnt > 0)
{
return iUploadedCnt + " Files Uploaded Successfully";
}
else
{
return "Upload Failed";
}
}
with the parameter the function is not call, how can post a file with a parameter.

How to call a .net method in AJAX on fileupload change?

I'm trying to upload a file using AJAX the problem is I'm a rookie in .net and don't know if I did this right or not so I appreciate any help or suggestions.
here is my html code:
<asp:FileUpload ID="FileUpload1" onChange="Show()" runat="server" />
My method should be called when users selects their file
this is the script I found in MSDN:
<script type="text/javascript">
function Show() {
var file = document.getElementById("FileUpload1");
alert("test")
$.ajax({
type: "POST",
url: "SendSms.aspx/StaticUpdate",
data: '{name:"test" }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function (response) {
alert("test1");
}
});
}
function OnSuccess(response) {
alert("test2");
}
</script>
and here is my ASP method:
[System.Web.Services.WebMethod]
public static void StaticUpdate()
{
SendSms upload = new SendSms();
upload.Upload();
}
public void Upload()
{
string FileName = System.DateTime.Now.ToString("ddmmyyhhmmsss") + FileUpload1.FileName;
if (IsPostBack)
{
Boolean fileOK = false;
String path = Server.MapPath("~/Upload/");
if (FileUpload1.HasFile)
{
String fileExtension =
System.IO.Path.GetExtension(FileName).ToLower();
String[] allowedExtensions = { ".txt" };
for (int i = 0; i < allowedExtensions.Length; i++)
{
if (fileExtension == allowedExtensions[i])
{
fileOK = true;
}
}
}
if (fileOK)
{
try
{
FileUpload1.PostedFile.SaveAs(path
+ FileName);
System.IO.StreamReader myFile =
new System.IO.StreamReader("C:\\inetpub\\wwwroot\\Viber_Bulk_UI\\Upload\\" + FileName + "");
TextBox2.Text = myFile.ReadToEnd();
myFile.Close();
string Path = "C:\\inetpub\\wwwroot\\Viber_Bulk_UI\\Upload\\" + FileName + "";
System.IO.File.Delete(Path);
}
catch (Exception ex)
{
Label1.Text = "File could not be uploaded.";
}
}
else
{
Label1.Text = "Cannot accept files of this type.";
}
}
}
The error I get is this:
NullReferenceException was unhandled by user code.
Object reference not set to an instance of an object.
Thanks in advance
string filename = System.IO.Path.GetFileName(FileUpload1.FileName);
string ext = System.IO.Path.GetExtension(FileUpload1.FileName);
if (fileExtension == ".txt"){
using (System.IO.FileStream fs = new System.IO.FileStream(Server.MapPath(("C:\\inetpub\\wwwroot\\Viber_Bulk_UI\\Upload\\" + FileName), System.IO.FileMode.Append, System.IO.FileAccess.Write, System.IO.FileShare.Read, 8, System.IO.FileOptions.None))
{
byte[] data = System.Text.Encoding.ASCII.GetBytes(FileName);
fs.Write(data, 0, data.Length);
fs.Flush();
fs.Close();
}
}

Valums Ajax Upload w/ C# ashx returns 'Index was out of range. Must be non-negative and less than the size of the collection.' error

I've been playing with Valum's AJAX upload script: http://valums.com/ajax-upload/
It ticks all the boxes for me, not using the horrid swfupload flash object for one. I have the JS point at my .ashx script (which for love-nor-money I cannot debug). This is what I have in the .ashx:
public class avatar : IHttpHandler, System.Web.SessionState.IRequiresSessionState {
public void ProcessRequest (HttpContext context) {
//Debugger.Break();
string result = "{\"success\":true}";
string path = HttpContext.Current.Server.MapPath("/client/vault/" + Helpers.CurrentClientHash(context.Session["SessionHash"].ToString()) + "/users/" + context.Session["SessionHash"].ToString() + "/");
string saveLocation = string.Empty;
string fileName = string.Empty;
try
{
int length = 4096;
int bytesRead = 0;
Byte[] buffer = new Byte[length];
//This works with Chrome/FF/Safari
// get the name from qqfile url parameter here
Debugger.Break();
fileName = context.Request["params"];
Debug.Write(fileName);
saveLocation = context.Server.MapPath(path) + fileName;
try
{
using (FileStream fileStream = new FileStream(saveLocation, FileMode.Create))
{
do
{
bytesRead = context.Request.InputStream.Read(buffer, 0, length);
fileStream.Write(buffer, 0, bytesRead);
}
while (bytesRead > 0);
}
}
catch (UnauthorizedAccessException ex)
{
// log error hinting to set the write permission of ASPNET or the identity accessing the code
result = result.Replace("true","false, \"error\":" + ex.Message + " " + ex.InnerException + " " + ex.StackTrace.ToString());
}
}
catch
{
try
{
//This works with IE
fileName = Path.GetFileName(context.Request.Files[0].FileName);
saveLocation = context.Server.MapPath(path) + fileName;
context.Request.Files[0].SaveAs(saveLocation);
}
catch (Exception ex)
{
result = result.Replace("true", "false, \"error\":" + ex.Message + " " + ex.InnerException);
}
}
context.Response.Write(result);
}
public bool IsReusable {
get {
return false;
}
}
}
This code was kindly offered up by another user of the Valum's script, because it ships with PHP server-side stuff. When I run the uploader, I get this in the console:
[uploader] responseText = {"success":false, "error":Index was out of
range. Must be non-negative and less than the size of the collection.
Parameter name: index }
...and the upload of course fails. I'm sure it has something to do with the FileStream, but without meaningful debugging I can't find the problem. I think it might be because the file isn't being picked-up by the .ashx, but it's in the params:
So, I have two questions if I may:
Can anyone see, right-off-the-bat where or why I'm getting the index exception?
If not, how can I debug this thing? I can't just run the debugger from VS2010, because non of the JS seems to load. I can't obviously go directly to the ashx either... Any ideas?
Help appreciated :)
Unfortunately, I never solved this. I uninstalled the Valams script and went for Plupload.
Plupload was easier, it supports HTML5, Flash, Gears and BrowserPlus. It was a no brainer in the end. Here is the working code for those looking for a C# AJAX Uploader widget:
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="http://bp.yahooapis.com/2.4.21/browserplus-min.js"></script>
<script type="text/javascript" src="/js/plupload.js"></script>
<script type="text/javascript" src="/js/plupload.html5.js"></script>
<script type="text/javascript" src="/js/plupload.gears.js"></script>
<script type="text/javascript" src="/js/plupload.browserplus.js"></script>
<script type="text/javascript" src="/js/plupload.silverlight.js"></script>
<script type="text/javascript">
// Custom example logic
function $(id) {
return document.getElementById(id);
}
var uploader = new plupload.Uploader({
runtimes: 'gears,html5,silverlight,browserplus',
browse_button: 'pickfiles',
max_file_size: '2mb',
multi_selection: false,
url: '/components/uploadify/avatar.ashx',
silverlight_xap_url: '/js/plupload.silverlight.xap',
filters: [
{ title: "Image files", extensions: "jpg,gif,png" }
]
});
uploader.bind('Init', function (up, params) {
$('filelist').innerHTML = "<div>Current runtime: " + params.runtime + "</div>";
});
uploader.bind('FilesAdded', function (up, files) {
for (var i in files) {
$('filelist').innerHTML += '<div id="' + files[i].id + '">' + files[i].name + ' (' + plupload.formatSize(files[i].size) + ') <b></b></div>';
}
});
uploader.bind('UploadFile', function (up, file) {
$('uploader').innerHTML += '<input type="hidden" name="file-' + file.id + '" value="' + file.name + '" />';
});
uploader.bind('UploadProgress', function (up, file) {
$(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
});
uploader.bind('FileUploaded', function (up, file, obj) {
alert("I've done uploading stuff...");
});
$('uploadfiles').onclick = function () {
uploader.start();
return false;
};
uploader.init();
</script>
And the C# .ashx...
public class avatar : IHttpHandler, System.Web.SessionState.IRequiresSessionState {
public void ProcessRequest (HttpContext context) {
string path = "/a/path/to/someplace/";
if (context.Request.Files.Count > 0)
{
int chunk = context.Request["chunk"] != null ? int.Parse(context.Request["chunk"]) : 0;
string fileName = context.Request["name"] != null ? context.Request["name"] : string.Empty;
HttpPostedFile fileUpload = context.Request.Files[0];
var uploadPath = path;
using (var fs = new FileStream(Path.Combine(uploadPath, fileName), chunk == 0 ? FileMode.Create : FileMode.Append))
{
var buffer = new byte[fileUpload.InputStream.Length];
fileUpload.InputStream.Read(buffer, 0, buffer.Length);
fs.Write(buffer, 0, buffer.Length);
}
}
}
public bool IsReusable {
get {
return false;
}
}
}
It maybe worthwhile noting, that if you want to access a session whilst in the .ashx, you'll just need to add SessionState.IRequiresSessionState as shown.
I hope peeps find this helpful :)
I used the ASHX handler which Syed Basher provided in his blog. It works perfectly.
public void ProcessRequest(HttpContext context)
{
const string path = "Capture/Images";
String filename = HttpContext.Current.Request.Headers["X-File-Name"];
if (string.IsNullOrEmpty(filename) && HttpContext.Current.Request.Files.Count <= 0)
{
context.Response.Write("{success:false}");
}
else
{
string mapPath = HttpContext.Current.Server.MapPath(path);
if (Directory.Exists(mapPath) == false)
{
Directory.CreateDirectory(mapPath);
}
if (filename == null)
{
//This work for IE
try
{
HttpPostedFile uploadedfile = context.Request.Files[0];
filename = uploadedfile.FileName;
uploadedfile.SaveAs(mapPath + "\\" + filename);
context.Response.Write("{success:true, name:\"" + filename + "\", path:\"" + path + "/" + filename + "\"}");
}
catch (Exception)
{
context.Response.Write("{success:false}");
}
}
else
{
//This work for Firefox and Chrome.
FileStream fileStream = new FileStream(mapPath + "\\" + filename, FileMode.OpenOrCreate);
try
{
Stream inputStream = HttpContext.Current.Request.InputStream;
inputStream.CopyTo(fileStream);
context.Response.Write("{success:true, name:\"" + filename + "\", path:\"" + path + "/" + filename + "\"}");
}
catch (Exception)
{
context.Response.Write("{success:false}");
}
finally
{
fileStream.Close();
}
}
}
}
The only exception handler I see that would produce these results is at the "This works with IE" block. The only index referenced within this block is Files[0].
I suggest adding a catch(Exception ex) to the first try/catch to determine why the code that works with Safari isn't working with IE. The other thing to note is that you're reading the stream for all browsers then attempt to re-read the stream just for IE. This would require resetting the stream to position 0.
See if this server-side script works with all browsers:
using System;
using System.Web;
using System.IO;
public class Upload : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{
string path = HttpContext.Current.Server.MapPath("/client/vault/"
+ Helpers.CurrentClientHash(context.Session["SessionHash"].ToString())
+ "/users/" + context.Session["SessionHash"].ToString()
+ "/");
HttpPostedFile oFile =
context.Request.Files[context.Request.Headers["X-File-Name"]];
if (!Directory.Exists(path)) Directory.CreateDirectory(path);
oFile.SaveAs(path + oFile.FileName);
context.Response.Write("1");
}
public bool IsReusable
{
get { return true; }
}
}

Categories