Currently i am loading the CSV file manually with input through the Open Dialog. I want to know how can i load it dinamycally when the page loads into the given template.
<input class="input-file" type="file" id="input" onchange="loadCsv(this.files)">
This is my current javascript that i am loading the CSV file through the input
function loadCsv(fileList) {
var file = fileList[0];
console.log("file: ", file);
Papa.parse(file, {
delimiter: ",",
header: true,
complete: function (result) {
console.log("All done!", result["data"]);
var resArr = result["data"];
var $threadList = $("#thread-list");
for (var k = 0; k < resArr.length; ++k) {
var html =
" <div class=\"users-wrap col-md-12\">" +
" <div class=\"row each-user\">" +
" <div class=\"avatar col-md-3 col-sm-3 col-xs-3\">" +
" <img class=\"img-responsive img-circle\" src=\"" + resArr[k]["avatarAssetLink"] + "\">" +
" </div>" +
" <div class=\"name col-md-6 col-sm-6 col-xs-6 text-left\">" +
" <p class='details'>" + resArr[k]["threadName"] + "<br />" +
" <span class='msg-price'>" +
" <span class='messages-counted'>" + " <strong> " +resArr[k]["messageCount"] +" </strong>" + '</span>'+
" <span class='price'> " + resArr[k]["Price"] + '</span>' +
" </span>" +
" </p>" +
" </div>" +
" <div class=\"checkbox-wrap col-md-3 col-sm-3 col-xs-3\">" +
" <div class=\"checkbox-as pull-right\">" +
" <i class=\"glyphicon glyphicon-ok\">" +
"</i>" +
" </div>" +
" </div>" +
" </div>" +
" </div>";
$threadList.append(html);
}
},
error: function () {
console.log("error!", arguments);
}
});
}
Any idea or advice is appreciated!