Open SharePoint Office documents in modal dialog : Binary Bits<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Open SharePoint Office documents in modal dialog : Binary Bits\" \/>\n<meta property=\"og:description\" content=\"Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab. The following code helps in implementing this. Note: This code only works for office documents. For pdf documents look at the previous article. ","yoast_head_json":{"title":"Open SharePoint Office documents in modal dialog : Binary Bits","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","og_locale":"en_GB","og_type":"article","og_title":"Open SharePoint Office documents in modal dialog : Binary Bits","og_description":"Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab. The following code helps in implementing this. Note: This code only works for office documents. For pdf documents look at the previous article. <!-- Put this code below […]","og_url":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","og_site_name":"Binary Bits","article_published_time":"2017-11-13T07:38:30+00:00","article_modified_time":"2021-05-03T10:50:10+00:00","author":"Kannan","twitter_card":"summary_large_image","twitter_creator":"@Kannan_B","twitter_site":"@Kannan_B","twitter_misc":{"Written by":"Kannan","Estimated reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#article","isPartOf":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"},"author":{"name":"Kannan","@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"headline":"Open SharePoint Office documents in modal dialog","datePublished":"2017-11-13T07:38:30+00:00","dateModified":"2021-05-03T10:50:10+00:00","mainEntityOfPage":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"},"wordCount":59,"commentCount":0,"publisher":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"keywords":["Modal","Modal Dialog","SharePoint"],"articleSection":["SharePoint"],"inLanguage":"en-GB","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","url":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","name":"Open SharePoint Office documents in modal dialog : Binary Bits","isPartOf":{"@id":"https:\/\/blog.binarybits.net\/#website"},"datePublished":"2017-11-13T07:38:30+00:00","dateModified":"2021-05-03T10:50:10+00:00","breadcrumb":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.binarybits.net\/"},{"@type":"ListItem","position":2,"name":"Open SharePoint Office documents in modal dialog"}]},{"@type":"WebSite","@id":"https:\/\/blog.binarybits.net\/#website","url":"https:\/\/blog.binarybits.net\/","name":"Binary Bits","description":"Bits & Pieces - A blog by Kannan Balasubramanian","publisher":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.binarybits.net\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"},{"@type":["Person","Organization"],"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855","name":"Kannan","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/","url":"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg","contentUrl":"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg","width":1270,"height":1270,"caption":"Kannan"},"logo":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962"}],"collection":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/comments?post=962"}],"version-history":[{"count":1,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962\/revisions"}],"predecessor-version":[{"id":963,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962\/revisions\/963"}],"wp:attachment":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/media?parent=962"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/categories?post=962"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/tags?post=962"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":962,"date":"2017-11-13T13:08:30","date_gmt":"2017-11-13T07:38:30","guid":{"rendered":"https:\/\/blog.binarybits.net\/?p=962"},"modified":"2021-05-03T16:20:10","modified_gmt":"2021-05-03T10:50:10","slug":"open-sharepoint-office-documents-modal-dialog","status":"publish","type":"post","link":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","title":{"rendered":"Open SharePoint Office documents in modal dialog"},"content":{"rendered":"

Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab.<\/p>\n

The following code helps in implementing this.<\/p>\n

Note: This code only works for office documents. For pdf documents look at the previous article.<\/p>\n

<!-- Put this code below the list view web part -->\r\n<script type=\"text\/javascript\" src=\"http:\/\/ajax.aspnetcdn.com\/ajax\/jQuery\/jquery-3.2.1.min.js\">\r\n<\/script>\r\n<script type=\"text\/javascript\">\r\n    $hrefVal = $(\"a[onclick*='return DispEx'][target!='_blank']\").attr(\"href\");\r\n    $siteUrl = _spPageContextInfo.webServerRelativeUrl;\r\n\r\n    $(\"a[onclick*='return DispEx'][target!='_blank']\")\r\n        .removeAttr(\"onclick\")\r\n        .attr(\"href\", \"javascript:OpenDocumentInDialogue(\\\"\" + $siteUrl + \"\/_layouts\/WopiFrame.aspx?action=default&sourcedoc=\" + $hrefVal + \"\\\")\");\r\n\r\n    function OpenDocumentInDialogue(href) {\r\n        var o;\r\n        $(\"body\").append(\"<div id='docTemp' style='min-height:600px;min-width:800px;height:100%;overflow:hidden'><object data='\" + href + \"' width='100%' height='100%'><\/object><\/div>\");\r\n        o = {};\r\n        o.html = $(\"#docTemp\")[0];\r\n        o.showMaximized = true;\r\n        o.title = href.substring(href.lastIndexOf(\"\/\") + 1);\r\n        o.dialogReturnValueCallback = OpenDocumentinDlgCallback;\r\n        SP.UI.ModalDialog.showModalDialog(o);\r\n    }\r\n\r\n    function OpenDocumentinDlgCallback() {\r\n        \/\/ do something here when the dialog closes\r\n    }\r\n<\/script><\/pre>\n <\/p>\n","protected":false},"excerpt":{"rendered":"
Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab. The following code helps in implementing this. Note: This code only works for office documents. For pdf documents look at the previous article. <!– Put this code below […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[62],"tags":[268,266,208],"yoast_head":"\nOpen SharePoint Office documents in modal dialog : Binary Bits<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\" \/>\n<meta property=\"og:locale\" content=\"en_GB\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Open SharePoint Office documents in modal dialog : Binary Bits\" \/>\n<meta property=\"og:description\" content=\"Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab. The following code helps in implementing this. Note: This code only works for office documents. For pdf documents look at the previous article. <!-- Put this code below […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\" \/>\n<meta property=\"og:site_name\" content=\"Binary Bits\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-13T07:38:30+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-05-03T10:50:10+00:00\" \/>\n<meta name=\"author\" content=\"Kannan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Kannan_B\" \/>\n<meta name=\"twitter:site\" content=\"@Kannan_B\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kannan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Estimated reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\"},\"author\":{\"name\":\"Kannan\",\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855\"},\"headline\":\"Open SharePoint Office documents in modal dialog\",\"datePublished\":\"2017-11-13T07:38:30+00:00\",\"dateModified\":\"2021-05-03T10:50:10+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\"},\"wordCount\":59,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855\"},\"keywords\":[\"Modal\",\"Modal Dialog\",\"SharePoint\"],\"articleSection\":[\"SharePoint\"],\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\",\"url\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\",\"name\":\"Open SharePoint Office documents in modal dialog : Binary Bits\",\"isPartOf\":{\"@id\":\"https:\/\/blog.binarybits.net\/#website\"},\"datePublished\":\"2017-11-13T07:38:30+00:00\",\"dateModified\":\"2021-05-03T10:50:10+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb\"},\"inLanguage\":\"en-GB\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.binarybits.net\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Open SharePoint Office documents in modal dialog\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.binarybits.net\/#website\",\"url\":\"https:\/\/blog.binarybits.net\/\",\"name\":\"Binary Bits\",\"description\":\"Bits & Pieces - A blog by Kannan Balasubramanian\",\"publisher\":{\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.binarybits.net\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-GB\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855\",\"name\":\"Kannan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-GB\",\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg\",\"contentUrl\":\"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg\",\"width\":1270,\"height\":1270,\"caption\":\"Kannan\"},\"logo\":{\"@id\":\"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Open SharePoint Office documents in modal dialog : Binary Bits","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","og_locale":"en_GB","og_type":"article","og_title":"Open SharePoint Office documents in modal dialog : Binary Bits","og_description":"Sometimes we need Microsoft Office documents to be opened in dialogs instead of SharePoint\u2019s default behavior which is opening the document in the same window or tab. The following code helps in implementing this. Note: This code only works for office documents. For pdf documents look at the previous article. <!-- Put this code below […]","og_url":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","og_site_name":"Binary Bits","article_published_time":"2017-11-13T07:38:30+00:00","article_modified_time":"2021-05-03T10:50:10+00:00","author":"Kannan","twitter_card":"summary_large_image","twitter_creator":"@Kannan_B","twitter_site":"@Kannan_B","twitter_misc":{"Written by":"Kannan","Estimated reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#article","isPartOf":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"},"author":{"name":"Kannan","@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"headline":"Open SharePoint Office documents in modal dialog","datePublished":"2017-11-13T07:38:30+00:00","dateModified":"2021-05-03T10:50:10+00:00","mainEntityOfPage":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"},"wordCount":59,"commentCount":0,"publisher":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"keywords":["Modal","Modal Dialog","SharePoint"],"articleSection":["SharePoint"],"inLanguage":"en-GB","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","url":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/","name":"Open SharePoint Office documents in modal dialog : Binary Bits","isPartOf":{"@id":"https:\/\/blog.binarybits.net\/#website"},"datePublished":"2017-11-13T07:38:30+00:00","dateModified":"2021-05-03T10:50:10+00:00","breadcrumb":{"@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb"},"inLanguage":"en-GB","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/blog.binarybits.net\/open-sharepoint-office-documents-modal-dialog\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.binarybits.net\/"},{"@type":"ListItem","position":2,"name":"Open SharePoint Office documents in modal dialog"}]},{"@type":"WebSite","@id":"https:\/\/blog.binarybits.net\/#website","url":"https:\/\/blog.binarybits.net\/","name":"Binary Bits","description":"Bits & Pieces - A blog by Kannan Balasubramanian","publisher":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.binarybits.net\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-GB"},{"@type":["Person","Organization"],"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/dda0e26212583a95f286cf67604fd855","name":"Kannan","image":{"@type":"ImageObject","inLanguage":"en-GB","@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/","url":"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg","contentUrl":"https:\/\/blog.binarybits.net\/wp-content\/uploads\/2017\/04\/12976869_10207528235497646_1307827709790943986_o.jpg","width":1270,"height":1270,"caption":"Kannan"},"logo":{"@id":"https:\/\/blog.binarybits.net\/#\/schema\/person\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962"}],"collection":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/comments?post=962"}],"version-history":[{"count":1,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962\/revisions"}],"predecessor-version":[{"id":963,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/posts\/962\/revisions\/963"}],"wp:attachment":[{"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/media?parent=962"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/categories?post=962"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.binarybits.net\/wp-json\/wp\/v2\/tags?post=962"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}