{"id":1760,"date":"2017-02-09T19:07:22","date_gmt":"2017-02-09T18:07:22","guid":{"rendered":"https:\/\/blog.kodono.info\/wordpress\/?p=1760"},"modified":"2017-02-09T19:09:05","modified_gmt":"2017-02-09T18:09:05","slug":"how-to-open-an-excel-document-from-sharepoint-files-into-chromefirefox-in-readonlyedit-mode","status":"publish","type":"post","link":"https:\/\/blog.kodono.info\/wordpress\/2017\/02\/09\/how-to-open-an-excel-document-from-sharepoint-files-into-chromefirefox-in-readonlyedit-mode\/","title":{"rendered":"How to open an Excel document from SharePoint into Chrome\/Firefox in readonly\/edit mode"},"content":{"rendered":"

With Sharepoint 2010, when you use Internet Explorer you can open an Office document in readonly or in edit mode. Also, when trying to open an Excel file in Firefox\/Chrome it will probably open the ugly xslviewer<\/code> and won’t let you deal with your file.<\/p>\n

After searching a bit about it, I found a clue<\/a> that helped me to find a good solution: on Firefox\/Chrome when you click on an Excel file, you’ll now have a modal asking if you want to open it in edit or readonly mode!
\n\"\"<\/p>\n

To achieve this result you have to insert the below Javascript code somewhere into your masterpage:<\/p>\n

\r\n\/**\r\n * fix problem with Excel documents on Firefox\/Chrome\r\n * @param  {HTMLElement} p the <A> element\r\n * @param  {HTMLEvent} a the click event\r\n * @param  {Boolean} h TRUE\r\n * @param  {Boolean} e FALSE\r\n * @param  {Boolean} g FALSE\r\n * @param  {Strin} k the ActiveX command (e.g. \"SharePoint.OpenDocuments.3\")\r\n * @param  {Number} c 0\r\n * @param  {String} o the activeX command, here we look at \"SharePoint.OpenDocuments\"\r\n * @param  {String} m\r\n * @param  {String} b the replacement URL to the xslviewer\r\n *\/\r\nvar bak_DispEx;\r\nvar modalOpenDocument; \/\/ it will be use with the modal\r\nSP.SOD.executeOrDelayUntilEventNotified(function() {\r\n  bak_DispEx = _DispEx;\r\n  _DispEx=function(p, a, h, e, g, k, c, o, m, b, j, l, i, f, d) {\r\n    \/\/ if o===\"SharePoint.OpenDocuments\" && !IsClientAppInstalled(o)\r\n    \/\/ in that case we want to open ask the user if he\/she wants to readonly or edit the file\r\n    var fileURL = b.replace(\/.*_layouts\\\/xlviewer\\.aspx\\?id=(.*)\/, \"$1\");\r\n    if (o === \"SharePoint.OpenDocuments\" && !IsClientAppInstalled(o) && \/\\.xlsx?$\/.test(fileURL)) {\r\n      \/\/ if the URL doesn't start with http\r\n      if (!\/^http\/.test(fileURL)) {\r\n        fileURL = window.location.protocol + \"\/\/\" + window.location.host + fileURL;\r\n      }\r\n      var ohtml = document.createElement('div');\r\n      ohtml.style.padding = \"10px\";\r\n      ohtml.style.display = \"inline-block\";\r\n      ohtml.style.width = \"200px\";\r\n      ohtml.style.width = \"200px\";\r\n      ohtml.innerHTML = '<style>'\r\n                      + '.opendocument_button { background-color:#fdfdfd; border:1px solid #ababab; color:#444; display:inline-block; padding: 7px 10px; }'\r\n                      + '.opendocument_button:hover { box-shadow: none }'\r\n                      + '#opendocument_readonly,#opendocument_edit { float:none; font-size: 100%; line-height: 1.15; margin: 0; overflow: visible; box-sizing: border-box; padding: 0; height:auto }'\r\n                      + '.opendocument_ul { list-style-type:none;margin-top:10px;margin-bottom:10px;padding-top:0;padding-bottom:0 }'\r\n                      + '<\/style>'\r\n                      + 'You are about to open:'\r\n                      + '<ul class=\"opendocument_ul\">'\r\n                      + '  <li>Name: <b>'+fileURL.split(\"\/\").slice(-1)+'<\/b><\/li>'\r\n                      + '  <li>From: <b>'+window.location.hostname+'<\/b><\/li>'\r\n                      + '<\/ul>'\r\n                      + 'How would like to open this file?'\r\n                      + '<ul class=\"opendocument_ul\">'\r\n                      + '  <li><label><input type=\"radio\" name=\"opendocument_choices\" id=\"opendocument_readonly\" checked> Read Only<\/label><\/li>'\r\n                      + '  <li><label><input type=\"radio\" name=\"opendocument_choices\" id=\"opendocument_edit\"> Edit<\/label><\/li>'\r\n                      + '<\/ul>'\r\n                      + '<div style=\"text-align: center;margin-top: 20px;\"><button type=\"button\" class=\"opendocument_button\" style=\"background-color: #2d9f2d;color: #fff;\" onclick=\"modalOpenDocument.close(document.getElementById(\\'opendocument_edit\\').checked)\">Open<\/button> <button type=\"button\" class=\"opendocument_button\" style=\"margin-left:10px\" onclick=\"modalOpenDocument.close(-1)\">Cancel<\/button><\/div>';\r\n      \/\/ show the modal\r\n      modalOpenDocument=SP.UI.ModalDialog.showModalDialog({\r\n        html:ohtml,\r\n        dialogReturnValueCallback:function(ret) {\r\n          if (ret!==-1) {\r\n            if (ret === true) { \/\/ edit\r\n              \/\/ reformat the fileURL\r\n              var ext;\r\n              if (\/\\.xlsx?$\/.test(b)) ext = \"ms-excel\";\r\n              if (\/\\.docx?$\/.test(b)) ext = \"ms-word\"; \/\/ not currently supported\r\n              fileURL = ext + \":ofe|u|\" + fileURL;\r\n            }\r\n            window.location.href = fileURL; \/\/ open the file\r\n          }\r\n        }\r\n      });\r\n      a.preventDefault();\r\n      a.stopImmediatePropagation()\r\n      a.cancelBubble = true;\r\n      a.returnValue = false;\r\n      return false;\r\n    }\r\n    return bak_DispEx.apply(this, arguments);\r\n  }\r\n}, \"sp.scriptloaded-core.js\")\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
With Sharepoint 2010, when you use Internet Explorer you can open an Office document in readonly or in edit mode. Also, when trying to open an Excel file in Firefox\/Chrome it will probably open the ugly xslviewer and won’t let you deal with your file. After searching a bit about it, I found a clue […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_coblocks_attr":"","_coblocks_dimensions":"","_coblocks_responsive_height":"","_coblocks_accordion_ie_support":"","hide_page_title":"","footnotes":""},"categories":[23,16,13,33],"tags":[24,152,158,117],"class_list":["post-1760","post","type-post","status-publish","format-standard","hentry","category-debug","category-navigateur","category-niveau-intermediaire","category-programmation","tag-javascript","tag-niveau-intermediaire","tag-programmation","tag-sharepoint"],"_links":{"self":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/1760","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/comments?post=1760"}],"version-history":[{"count":4,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/1760\/revisions"}],"predecessor-version":[{"id":1764,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/posts\/1760\/revisions\/1764"}],"wp:attachment":[{"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/media?parent=1760"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/categories?post=1760"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.kodono.info\/wordpress\/wp-json\/wp\/v2\/tags?post=1760"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}