<div class="upload_Wrap">
<ejs-uploader id="UploadFiles" failure="onUplaodFail" asyncSettings="@asyncSettings"></ejs-uploader>
</div>
<script>
function onUplaodFail(args) {
var header = args.response.headers;
var statusMessage = header.slice(header.indexOf('status'), header.indexOf('date'));
statusMessage = statusMessage.slice(statusMessage.indexOf(',') + 1);
args.statusText = statusMessage.trim();
}
</script> |
[AcceptVerbs("Post")]
public IActionResult Save(IList<IFormFile> UploadFiles)
{
try
{
foreach (var file in UploadFiles)
{
if (UploadFiles != null)
{
var filename = ContentDispositionHeaderValue.Parse(file.ContentDisposition).FileName.Trim('"');
filename = hostingEnv.WebRootPath + $@"{filename}";
if (!System.IO.File.Exists(filename))
{
using (FileStream fs = System.IO.File.Create(filename))
{
file.CopyTo(fs);
fs.Flush();
}
}
else
{
Response.Clear();
Response.StatusCode = 404;
Response.Headers.Add("status", "File Already Exists");
}
}
}
}
catch (Exception e)
{
Response.Clear();
Response.ContentType = "application/json; charset=utf-8";
Response.StatusCode = 400;
Response.Headers.Add("status", e.Message);
}
return Content("");
} |
@{
var asyncSettings = new Syncfusion.EJ2.Inputs.UploaderAsyncSettings { SaveUrl = "https://localhost:44342/Home/Save", RemoveUrl = "https://localhost:44342/Home/Remove" };
}
<ejs-uploader id="uploadFiles" asyncSettings="@asyncSettings" autoUpload="false" selected="onSelect" success="onSuccess" failure=""="onFailure" ></ejs-uploader>
<script>
function onSuccess() {
console.log("success")
}
function onFailure() {
console.log("failur")
}
</script> |
public IActionResult OnPostUpload(IList<IFormFile> uploadFiles)
{
//...
// no need to update the Response here
@* Response.Clear();
Response.ContentType = "application/json"; *@
// Sennd HTTP 200 (OK), 400, or what you want.
return StatusCode(200, new { Message = $"{successMessage}" });
}
|
Hi there,
I'm using the approach above using the response body to set the failure message, but the only thing I can't figure out is if it is possible to split the response over multiple lines.
e.g. my response content is:
One or more users failed.
Record with user name 'User name' has the incorrect number of values.
Record with user name 'azure_cli_user' has the incorrect number of values.
But it displays as:
One or more users failed. Record with user name 'User name' has the incorrect number of values. Record with user name 'azure_cli_user' has the incorrect number of values.
I'd like it to display as:
One or more users failed.
Record with user name 'User name' has the incorrect number of values.
Record with user name 'azure_cli_user' has the incorrect number of values.
Is this possible?
|
<div class="upload_Wrap">
<ejs-uploader id="UploadFiles" failure="onUplaodFail" actionComplete="FilerenderingHandler" asyncSettings="@asyncSettings"></ejs-uploader>
</div>
<script>
var username = 'peter'
var user = 'azure_cli_user'
function onUplaodFail(args) {
var header = args.response.headers;
var statusMessage = header.slice(header.indexOf('status'), header.indexOf('date'));
statusMessage = statusMessage.slice(statusMessage.indexOf(',') + 1);
console.log(statusMessage);
//args.statusText = args.response.headers.slice(header.indexOf('status'), header.indexOf('.'));;
}
function FilerenderingHandler(args) {
if (document.getElementsByClassName('e-upload-fails')) {
var failureMessage = document.getElementsByClassName('e-upload-fails');
for (var i = 0; i < failureMessage.length;i++ )
document.getElementsByClassName('e-upload-fails')[i].innerHTML = "<span>One or more users failed</span> <br/> <span>Record with user name " + username + " has the incorrect number of values</span> <br/> <span>Record with user name " + user+" has the incorrect number of values</span>"
}
console.log(args);
} |
Thanks Deepak, that is brilliant! Got it working in my solution, and looking good :)
Hi, I have similar requirement where I want to receive the errors in File upload from server. I can add that in Resonse headers from server. But I never recieve them in my angular applicaiton in
Hi Dheeraj Verma,
Thank you for the update. If you need to receive the custom header in the Failure event, you need to add the header in the save method on the server side as shown below.
Response.Headers.Add("Access-Control-Expose-Headers", "ID"); Response.Headers.Add("ID", "Custom Message"); |
Please find the client and server side sample for your reference.
KB Reference: https://support.syncfusion.com/kb/article/14941/handling-custom-parameters-in-javascript-file-upload-control
Regards,
Priyanka K