Box File Picker HTML Widget

Hi Brant,

You were close. Please see the updated example below.

In lines 5 and 8, replace 012345 with the clientId for your application. To get your clientId, go to this page and then click Edit Application. Your clientId will be the six digit number at the end of the URL on that page (https://cloud.app.box.com/developers/services/edit/012345).

After the user selects their files, the Box API will return the name, url, type, access level, and id of each file in a JSON response object. 

[
 {
 "url" : "https://app.box.com/s/jdfad234232df123aad",
 "name" : "fileName1.docx",
 "access" : "collaborators",
 "type" : "file",
 "id" : 14837512438
 },
 {
 "url" : "https://app.box.com/s/jdfad234232df123aad",
 "name" : "fileName2.docx",
 "access" : "collaborators",
 "type" : "file",
 "id" : 14837512484
 }
]

From the JSON response object, you can get the shared links for the files the user selected. The example below shows how to do this.

// Register a success callback handler
boxSelect.success(function(response) {

var sharedLinks = [];

//Parse shared links from response and store in sharedLinks array
for(var i = 0; i < Object.keys(response).length; i++) {
    var obj = response[i];
    sharedLinks.push(obj.url);
}

console.log(sharedLinks);
});

Murtza,

Thank you very much for the quick response!  Your example worked perfectly.  

Would it be easy to modify the code to have the sharedLinks array print into a text area within the webpage?  I have a foggy idea in my head of adding some simple scripting to display what is stored in the array, but as I mentioned before, I am definitely not a developer and any help would be  much appreciated! 

Happy to hear you got it working!  

Please see the updated example below. I added the following:

• Line 6, which creates a HTML element where we can put the list of links to the user's seleted files 
• Line 27-33, which adds the list of links to the user's seleted files to the HTML element created in line 6

Murtza,

You have made my day!  Your updated example is exactly what I was looking for.

Thanks very much!!