Tabrez Blog

Following CSOM code is for accessing the HostWeb resources from AppWeb:

//Get Folder Name and it's Containing files
(function () {

jQuery(function () {
ExecuteOrDelayUntilScriptLoaded(initializePage, "sp.js");
});

function initializePage() {

var appUrl = GetUrlKeyValue("SPAppWebUrl");
var hostUrl = GetUrlKeyValue("SPHostUrl");

//var context = new SP.ClientContext(appUrl); // Appweb Context
var context = SP.ClientContext.get_current();
var hostContext = new SP.AppContextSite(context, hostUrl);

var rootFolder = hostContext.get_web().get_rootFolder();
var folders = rootFolder.get_folders();
var myFolders = context.loadQuery(folders, "Include(Name, Files)");
context.executeQueryAsync(success, fail);

function success() {
var message = jQuery("#message");
//message.text(myFolders.length);
message.text("");
jQuery.each(myFolders, function (index, value) {
showFiles(message, value);
});
}

function showFiles(message, folder) {
var fenum = folder.get_files().getEnumerator();
var i = 0;
while (fenum.moveNext()) {
i += 1;
if (i == 1) {
message.append(folder.get_name() + ":");
}

var name = fenum.get_current().get_name();
message.append("<div style ='padding-left:10px'>" + name + "</div>");
}
if (i > 0) {
message.append("<br/>");
}
}

function fail(sender, args) {
alert("Call failed Error: " + args.get_message());
}
}
})();

App.js (1.71 kb)

Output:

Give Permission:

Trust it:

And here is your output:

Voila! Done........