View Office documents in browser

[Ivan Wilson]

Is it possible to configure vLookup running in Office 365 to display Microsoft Office files in the browser (new tab)? Currently they are downloading to the local computer

[Alexander Bautz]

Hi,
You can add this code to the Custom JS in DFFS:

function openWordAndExcelFilesInBrowser(a,item){
    var docName = item.get_item("FileLeafRef");
    var link = makeAbsUrl(item.get_item("FileDirRef") + "/" + docName);
	switch(item.get_item("DocIcon").toLowerCase()){
		case "docx":
		case "xlsx":
			a = "<a href='"+_spPageContextInfo.webServerRelativeUrl+"/_layouts/15/WopiFrame.aspx?sourcedoc={A9149557-15AB-49B6-8294-AAC3C0C3FE7A}&file="+docName+"&action=default' target='_blank'>"+docName+"</a>";
		break;
	}
	return a;
}

You must change “{A9149557-15AB-49B6-8294-AAC3C0C3FE7A}” with the GUID of the document library where the documents are located.

Then use this in the “Special configuration” for the field “FileLeafRef” in the viewfields section in vLookup config:

{"function":"openWordAndExcelFilesInBrowser"}

Let me know how this works out.

Alexander

[Wayne Thompson]

Hi Alexander,

The function {“function”:”openWordAndExcelFilesInBrowser”} generated an error for me.

Any ideas?

Wayne

[Alexander Bautz]

What is the error message?

Alexander

[HYM]

Hi Alex, i think the issue here is with GUID, we should use the GUID of the item and not the List GUID.
Correct?

[HYM]

Alex what’s the difference btw Document “UniqueId” and “GUID”?

[Alexander Bautz]

Ah, my bad – you are correct, the sourcedoc parameter is the UniqueId of the document and not the GUID of the document library.

Let me know how it works out.

Alexander

[HYM]

actually i didn’t put time on it but i don’t know how to get the UniqueID of the document. i was thinking to do an API call to get “ServerRedirectedEmbedUri” and use it.

what do you think, any idea about how to find the UniqueID other than the API call?

[Alexander Bautz]

To be able to use the UniqueId value you must select this column in the ViewFields in your vLookup config, and then use this config in Special configuration:

{"function":"openWordAndExcelFilesInBrowser"}

I have changed the function and checked that it works in my setup, but please note that it might not work if you are on a locally installed (on premises) SharePoint.

Add this to your custom js – and please note that if you use vLookup in a list view you must also include it in a script editor web part in the list view:

function openWordAndExcelFilesInBrowser(a, item) {
    var r = "";
    var docName = item.get_item("FileLeafRef");
    var docType = docName.substring(docName.lastIndexOf(".") + 1);
    var uniqueId = item.get_item("UniqueId").toString();
    switch (docType.toLowerCase()) {
        case "docx":
        case "xlsx":
            r = "<a href='" + _spPageContextInfo.webServerRelativeUrl + "/_layouts/15/WopiFrame.aspx?sourcedoc={" + uniqueId + "}&file=" + docName + "&action=default' target='_blank'>" + docName + "</a>";
            break;
    }
    return r;
}

I did however find a better solution – use EncodedAbsUrl in the ViewFields in your vLookup config – keep the Special configuration as in the above example and add this to your Custom JS:

function openWordAndExcelFilesInBrowser(fullUrl){
	var docName = fullUrl.substring(fullUrl.lastIndexOf("/") + 1);
	return "<a href='"+fullUrl+"?Web=1' target='_blank'>"+docName+"</a>";
}

Let me know how this works out.

Alexander

[HYM]

yes these 2 solutions worked fine i think now @wayne thompson can use one of them but i changed the second solution because it’s showing the file name with “%20…%20….” to look like this

function openWordAndExcelFilesInBrowser1(a, item){
    var docName = item.get_item("FileLeafRef");
    var fullUrl = item.get_item("EncodedAbsUrl");
    
	//var docName = fullUrl.substring(fullUrl.lastIndexOf("/") + 1);
	return "<a href='"+fullUrl+"?Web=1' target='_blank'>"+docName+"</a>";
}

[Alexander Bautz]

I’m glad you got it running.

Alexander

[Author]

Posts