Hi,
I'm not much of a front end developer and made up the following as I went along, but work in FF, and realized in IE and Chrome, the screen just "freeze".
However in FireFox, for each record that get processed , the progress bar update nicely and each row have a cell which I update with an icon.
Guess better to just post my code, hoping it make sense?
Oh, before this I build up a table of all records, give the first one a class name of "recordRow" and data-id of the record's id.
So the code loop over all records, and call a server side method that process the record and return a empty string (success) or error.
Note this all work in all browsers...it's just the screen seems to "freeze" (not updating the progress bar or anything)....Fine in Firefox..oh I said that...:sick: (late here)
UPDATE: I just realized if I add a .always to the ajax call and put an alert in there, IE show the alert and update the screen.
I tried set cache to false, but still no joy.
I'm not much of a front end developer and made up the following as I went along, but work in FF, and realized in IE and Chrome, the screen just "freeze".
However in FireFox, for each record that get processed , the progress bar update nicely and each row have a cell which I update with an icon.
Guess better to just post my code, hoping it make sense?
Oh, before this I build up a table of all records, give the first one a class name of "recordRow" and data-id of the record's id.
So the code loop over all records, and call a server side method that process the record and return a empty string (success) or error.
Note this all work in all browsers...it's just the screen seems to "freeze" (not updating the progress bar or anything)....Fine in Firefox..oh I said that...:sick: (late here)
HTML Code:
$('#btnImport').on('click', function(event) {
event.preventDefault();
var total = $('.recordRow').length;
var current = 0;
$('#progressBarContainer').show();
var url = '/Portal/Admin/MemberImport/ImportRecord';
$('.recordRow').each(function() {
var id = $(this).data("id");
current++;
$('#progressBar').width(current / total * 100 + '%');
var cell = $(this);
var row = cell.closest('tr');
cell.html('<i class="icon icon-refresh"></i>');
var model = {
Id: id
};
$.ajax({
url: url,
type: 'GET',
data: model,
dataType: 'json',
async: false
}).done(function(data) {
if (data == '') {
cell.html('<i class="icon icon-ok"></i>');
$('#tblRecords tr[data-id="'+id+'"]').addClass('info');
} else {
cell.html('<a href="#" data-toggle="tooltip" data-placement="right" class="tip" title="' + data + '"><i class="icon icon-remove"></i></a>');
row.addClass('error');
}
$('.tip').tooltip();
});
});
$('#progressBarContainer').hide();
alert("Import Complete. It would be best to delete the batch file now.");
});I tried set cache to false, but still no joy.