I want it to appear with the progress bar when the excel import process is completed in Asp.Net Mvc. The number of data I want in excel, the progress bar should progress as much as the number of data in excel. How can I do that? I have to solve it very quickly.
Please can you help me?
This is a snippet of my code:
[HttpPost]
public ActionResult Upload(FormCollection formCollection)
{
var mapList = new List<AWSServerless_Google_Geocoding_Mvc.Models.Map>();
if (Request != null)
{
HttpPostedFileBase file = Request.Files["FileUpload"];
if ((file != null) && (file.ContentLength > 0) && !string.IsNullOrEmpty(file.FileName))
{
string fileName = file.FileName;
string fileContentType = file.ContentType;
byte[] fileBytes = new byte[file.ContentLength];
var data = file.InputStream.Read(fileBytes, 0, Convert.ToInt32(file.ContentLength));
using (var package = new ExcelPackage(file.InputStream))
{
ExcelPackage.LicenseContext = LicenseContext.NonCommercial;
var currentSheet = package.Workbook.Worksheets;
var workSheet = currentSheet.First();
var noOfCol = workSheet.Dimension.End.Column;
var noOfRow = workSheet.Dimension.End.Row;
for (int rowIterator = 1; rowIterator <= noOfRow; rowIterator++)
{
var map = new AWSServerless_Google_Geocoding_Mvc.Models.Map();
map.UserID = null;
map.Name = null;
map.Latitude = workSheet.Cells[rowIterator, 3].Value.ToString();
map.Longitude = workSheet.Cells[rowIterator, 4].Value.ToString();
map.Address = workSheet.Cells[rowIterator, 5].Value.ToString();
mapList.Add(map);
}
}
}
}
using (LocationDBEntities db = new LocationDBEntities())
{
foreach (var item in mapList)
{
db.Map.Add(item);
}
db.SaveChanges();
}
return RedirectToAction("Index", "Home");
}
This is a snippet of my javascript code:
var bar = $('.progress-bar');
var percent = $('.percent');
var status = $('#status');
var files = $("#FileUpload").get(0).files;
$('#Myform').ajaxForm({
beforeSend: function () {
$('#status').empty();
var percentVal = '0%';
$('.progress-bar').width(percentVal);
$('.percent').html(percentVal);
},
uploadProgress: function (event, position, total, percentComplete) {
for (var i = 0; i < files.length; i++) {
var percentVal = percentComplete + '%';
$('.progress-bar').width(percentVal);
$('.percent').html(percentVal);
}
},
complete: function (xhr) {
if (xhr.success == true) {
setTimeout(function () {// wait for 5 secs(2)
swal({
title: "Başarılı!",
text: "Kayıt Başarılı!",
type: "success",
showCancelButtonClass: "btn-primary",
confirmButtonText: "OK"
});
location.reload(); // then reload the page.(3)
}, 5000);
}
}
});
Your current progress bar is based on the number of bytes uploaded. To create a progress bar a the server requires the the server to calc the processing, and then to support the client requesting this progress.
first add a rqid to the transaction, so it unique. If it a single web server, you can use a static collection indexed by rqid to store the progress. Then create a sessionless method to retrieve the progress by rqid. Then on the client one the upload progress
hits done, start polling for the processing progress.
instead of polling you could use signalr. In that case the upload would to include the client Id.
Another option is to just fake it (this is actually very common, it how browser progress bars work). First guess at how long it will take. Say 10 seconds. Use a timer to update the progress. Once you are past the half mark (5 seconds) you slow down the progress,
by going half as far. Once you hit 3/4 you cut the progress distance again. You can play with the number to get a smooth feel.
So, the number of data in excel is how the progress bar progresses by the number of data in excel. For example, there are 3 data in excel. Progress bar 3 units of progress. And I have to solve this very quickly. Can you please help me?
as I said you will need to write a full communication system to pass back the server progress. If you need a quick fix, just replace your code with a fake progress bar.
Member
6 Points
19 Posts
Asp.Net MVC
Jun 24, 2020 11:03 AM|emre.senturk|LINK
I want it to appear with the progress bar when the excel import process is completed in Asp.Net Mvc. The number of data I want in excel, the progress bar should progress as much as the number of data in excel. How can I do that? I have to solve it very quickly. Please can you help me?
This is a snippet of my code:
[HttpPost] public ActionResult Upload(FormCollection formCollection) { var mapList = new List<AWSServerless_Google_Geocoding_Mvc.Models.Map>(); if (Request != null) { HttpPostedFileBase file = Request.Files["FileUpload"]; if ((file != null) && (file.ContentLength > 0) && !string.IsNullOrEmpty(file.FileName)) { string fileName = file.FileName; string fileContentType = file.ContentType; byte[] fileBytes = new byte[file.ContentLength]; var data = file.InputStream.Read(fileBytes, 0, Convert.ToInt32(file.ContentLength)); using (var package = new ExcelPackage(file.InputStream)) { ExcelPackage.LicenseContext = LicenseContext.NonCommercial; var currentSheet = package.Workbook.Worksheets; var workSheet = currentSheet.First(); var noOfCol = workSheet.Dimension.End.Column; var noOfRow = workSheet.Dimension.End.Row; for (int rowIterator = 1; rowIterator <= noOfRow; rowIterator++) { var map = new AWSServerless_Google_Geocoding_Mvc.Models.Map(); map.UserID = null; map.Name = null; map.Latitude = workSheet.Cells[rowIterator, 3].Value.ToString(); map.Longitude = workSheet.Cells[rowIterator, 4].Value.ToString(); map.Address = workSheet.Cells[rowIterator, 5].Value.ToString(); mapList.Add(map); } } } } using (LocationDBEntities db = new LocationDBEntities()) { foreach (var item in mapList) { db.Map.Add(item); } db.SaveChanges(); } return RedirectToAction("Index", "Home"); }This is a snippet of my javascript code:
var bar = $('.progress-bar'); var percent = $('.percent'); var status = $('#status'); var files = $("#FileUpload").get(0).files; $('#Myform').ajaxForm({ beforeSend: function () { $('#status').empty(); var percentVal = '0%'; $('.progress-bar').width(percentVal); $('.percent').html(percentVal); }, uploadProgress: function (event, position, total, percentComplete) { for (var i = 0; i < files.length; i++) { var percentVal = percentComplete + '%'; $('.progress-bar').width(percentVal); $('.percent').html(percentVal); } }, complete: function (xhr) { if (xhr.success == true) { setTimeout(function () {// wait for 5 secs(2) swal({ title: "Başarılı!", text: "Kayıt Başarılı!", type: "success", showCancelButtonClass: "btn-primary", confirmButtonText: "OK" }); location.reload(); // then reload the page.(3) }, 5000); } } });Can somebody help me with this? Thanks :)
All-Star
58184 Points
15655 Posts
Re: Asp.Net MVC
Jun 24, 2020 02:31 PM|bruce (sqlwork.com)|LINK
Your current progress bar is based on the number of bytes uploaded. To create a progress bar a the server requires the the server to calc the processing, and then to support the client requesting this progress.
first add a rqid to the transaction, so it unique. If it a single web server, you can use a static collection indexed by rqid to store the progress. Then create a sessionless method to retrieve the progress by rqid. Then on the client one the upload progress hits done, start polling for the processing progress.
instead of polling you could use signalr. In that case the upload would to include the client Id.
Another option is to just fake it (this is actually very common, it how browser progress bars work). First guess at how long it will take. Say 10 seconds. Use a timer to update the progress. Once you are past the half mark (5 seconds) you slow down the progress, by going half as far. Once you hit 3/4 you cut the progress distance again. You can play with the number to get a smooth feel.
Member
6 Points
19 Posts
Re: Asp.Net MVC
Jun 24, 2020 02:40 PM|emre.senturk|LINK
Hello Bruce, thank you for your answer. I could not understand what you mean. Can you send me sample code?
In fact, exactly what I want, as shown in the example below.
https://jsfiddle.net/sL7p3uvd/
So, the number of data in excel is how the progress bar progresses by the number of data in excel. For example, there are 3 data in excel. Progress bar 3 units of progress. And I have to solve this very quickly. Can you please help me?
All-Star
58184 Points
15655 Posts
Re: Asp.Net MVC
Jun 24, 2020 03:35 PM|bruce (sqlwork.com)|LINK
as I said you will need to write a full communication system to pass back the server progress. If you need a quick fix, just replace your code with a fake progress bar.
here is a sample fake:
https://codepen.io/-1117/pen/zYxbqxO
this one doesn't but its typical to to jump to the end on stop.
so in you code you do a start when the ajax call is started, and stop on completion.