Javascript - Retrieve names of files in a folder
I have a requirement where I need to retrieve all the filenames from a folder in client side.
Hence I am trying to retrieve the names of the files in a folder using Jquery referring to this answer.
My code is as follows:
<script>
var fileExt = ".xml";
$(document).ready(
function(){
$.ajax({
//This will retrieve the contents of the folder if the folder is configured as 'browsable'
url: 'xml/',
success: function (data) {
$("#fileNames").html('<ul>');
//List all xml file names in the page
$(data).find('a:contains(" + fileExt + ")').each(function () {
var filename = this.href.replace(window.location, "").replace("http:///", "");
$("#fileNames").append( '<li>'+filename+'</li>');
});
$("#fileNames").append('</ul>');
}
});
});
</script>
HTML code is as follows:
<div id="fileNames"></div>
But I get the following error when I run the code in chrome and firefox:
chrome: XMLHttpRequest cannot load file:///E:/Test/xml/. Received an invalid response. Origin 'null' is therefore not allowed access.
Firefox: ReferenceError: $ is not defined
I have tried googling a lot but the error is not resolved.
Your help would highly be appreciated.
Answer
<html>
<body>
<div id='fileNames'></div>
</body>
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function ()
{
$.get(".", function(data)
{
$("#fileNames").append(data);
});
})
</script>
this will print all the files in a folder on webpage.