{"id":1331,"date":"2017-11-02T09:32:15","date_gmt":"2017-11-02T14:32:15","guid":{"rendered":"https:\/\/www.teamdesk.net\/blog\/?p=1331"},"modified":"2017-11-02T09:40:41","modified_gmt":"2017-11-02T14:40:41","slug":"database-pages-run-script","status":"publish","type":"post","link":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/","title":{"rendered":"Script to run on every page of your database"},"content":{"rendered":"<p>To extend database functionality even further we&#8217;ve added an ability to run custom script on every page of your database. To keep in line with <a href=\"https:\/\/www.teamdesk.net\/blog\/tips-tricks\/customize-database-look\/\">dbstyles.css logic<\/a> all you need is to place dbscript.js in your database&#8217;s resources section.<br \/>\n<!--more--><br \/>\nAs the script file is loaded and executed <a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/HTML\/Element\/script#Attributes\">asynchronously<\/a>, its exact execution time is not known and may happen prior to page is fully loaded. If you are going to transform page content with script code, you may need to postpone code execution to later time. You can rely on jQuery facilities to do that:<\/p>\n<pre>jQuery(<span style=\"color: #000080;\">function<\/span>() { \r\n<span style=\"color: #008000;\">    \/\/ here page load is complete<\/span>\r\n<span style=\"color: #008000;\">    \/\/ insert some content on top of every page<\/span>\r\n    jQuery(<span style=\"color: #800000;\">\"#td-bodyframe\"<\/span>).prepend(<span style=\"color: #800000;\">\"&lt;p&gt;This will appear below tabs and above page's content&lt;\/p&gt;\"<\/span>);\r\n});\r\n<\/pre>\n<h2>Limit script execution scope<\/h2>\n<p>Body tag of each page has an identifier built from the name of the page and table\u2019s internal identifier, say, <em>overview_t_909. <\/em>You can <span style=\"display: inline !important; float: none; background-color: transparent; color: #333333; cursor: text; font-family: Georgia,'Times New Roman','Bitstream Charter',Times,serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; line-height: 24px; orphans: 2; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;\">use CSS selectors &#8211; the same way you can do it with dbstyles.css &#8211; to limit script execution to some contexts using jQuery.<\/span><\/p>\n<pre>jQuery(<span style=\"color: #000080;\">function<\/span>() { \r\n    <span style=\"color: #000080;\">if<\/span>(jQuery(<span style=\"color: #800000;\">\"body[id^=\"overview\"]\"<\/span>).length) {\r\n<span style=\"color: #339966;\">        \/\/ this will run on every overview page, but not on views and forms\r\n<\/span>    }\r\n    <span style=\"color: #000080;\">if<\/span>(jQuery(<span style=\"color: #800000;\">\"body[id$=\"_t_909\"]\"<\/span>).length) {\r\n<span style=\"color: #339966;\">        \/\/ this will run on any page in Invoice table<\/span>\r\n    }\r\n    <span style=\"color: #000080;\">if<\/span>(jQuery(<span style=\"color: #800000;\">\"body#overview_t_909\"<\/span>).length) {\r\n<span style=\"color: #339966;\">        \/\/ this will run on overview page of Invoice table<\/span>\r\n    }\r\n});<\/pre>\n<h2>Load external libraries<\/h2>\n<p>If you need external libraries, you can rely on FS.addScript(url, callback) function to request library script and execute the code after <span style=\"display: inline !important; float: none; background-color: transparent; color: #333333; cursor: text; font-family: Georgia,'Times New Roman','Bitstream Charter',Times,serif; font-size: 16px; font-style: normal; font-variant: normal; font-weight: 400; letter-spacing: normal; line-height: 24px; orphans: 2; text-align: left; text-decoration: none; text-indent: 0px; text-transform: none; -webkit-text-stroke-width: 0px; white-space: normal; word-spacing: 0px;\">library <\/span>is loaded:<\/p>\n<pre>FS.addScript(<span style=\"color: #800000;\">\"\/\/maps.googleapis.com\/maps\/api\/js\"<\/span>, <span style=\"color: #000080;\">function<\/span>() {\r\n    <span style=\"color: #008000;\">\/\/ do Google Maps stuff\r\n<\/span>});<\/pre>\n<h2>Real world example<\/h2>\n<p>Say, you want to run Google Analytics. Simply place their code without surrounding script tags to your dbstyles.js &#8211; with modified tracking ID of course.<\/p>\n<pre>(<span style=\"color: #000080;\">function<\/span>(i,s,o,g,r,a,m){i[<span style=\"color: #800000;\">'GoogleAnalyticsObject'<\/span>]=r;i[r]=i[r]||<span style=\"color: #000080;\">function<\/span>(){\r\n(i[r].q=i[r].q||[]).push(arguments)},i[r].l=<span style=\"color: #008000;\">1<\/span>*<span style=\"color: #000080;\">new<\/span> <span style=\"color: #800080;\">Date<\/span>();a=s.createElement(o),\r\nm=s.getElementsByTagName(o)[<span style=\"color: #008000;\">0<\/span>];a.async=<span style=\"color: #008000;\">1<\/span>;a.src=g;m.parentNode.insertBefore(a,m)\r\n})(window,document,<span style=\"color: #800000;\">'script'<\/span>,<span style=\"color: #800000;\">'https:\/\/www.google-analytics.com\/analytics.js'<\/span>,<span style=\"color: #800000;\">'ga'<\/span>);\r\n\r\nga(<span style=\"color: #800000;\">'create'<\/span>, <span style=\"color: #800000;\">'UA-XXXXX-Y'<\/span>, <span style=\"color: #800000;\">'auto'<\/span>);\r\nga(<span style=\"color: #800000;\">'send'<\/span>, <span style=\"color: #800000;\">'pageview'<\/span>);\r\n<\/pre>\n<p>Enjoy!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>To extend database functionality even further we&#8217;ve added an ability to run custom script on every page of your database. To keep in line with dbstyles.css logic all you need is to place dbscript.js in your database&#8217;s resources section.<\/p>\n","protected":false},"author":4,"featured_media":1332,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-1331","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-whats-new"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Script to run on every page of your database - TeamDesk Blog<\/title>\n<meta name=\"description\" content=\"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Script to run on every page of your database - TeamDesk Blog\" \/>\n<meta property=\"og:description\" content=\"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/\" \/>\n<meta property=\"og:site_name\" content=\"TeamDesk Blog\" \/>\n<meta property=\"article:published_time\" content=\"2017-11-02T14:32:15+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-11-02T14:40:41+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1547\" \/>\n\t<meta property=\"og:image:height\" content=\"821\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Kirill Bondar\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kirill Bondar\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/\"},\"author\":{\"name\":\"Kirill Bondar\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"headline\":\"Script to run on every page of your database\",\"datePublished\":\"2017-11-02T14:32:15+00:00\",\"dateModified\":\"2017-11-02T14:40:41+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/\"},\"wordCount\":217,\"commentCount\":2,\"image\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/dbscript.jpg\",\"articleSection\":[\"What's New\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/\",\"name\":\"Script to run on every page of your database - TeamDesk Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/dbscript.jpg\",\"datePublished\":\"2017-11-02T14:32:15+00:00\",\"dateModified\":\"2017-11-02T14:40:41+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"description\":\"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/dbscript.jpg\",\"contentUrl\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/wp-content\\\/uploads\\\/2017\\\/11\\\/dbscript.jpg\",\"width\":1547,\"height\":821,\"caption\":\"script and css to load on the page\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/database-pages-run-script\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Script to run on every page of your database\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/\",\"name\":\"TeamDesk Blog\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\",\"name\":\"Kirill Bondar\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g\",\"caption\":\"Kirill Bondar\"},\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/author\\\/kirill-bondar\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Script to run on every page of your database - TeamDesk Blog","description":"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.","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:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/","og_locale":"en_US","og_type":"article","og_title":"Script to run on every page of your database - TeamDesk Blog","og_description":"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.","og_url":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/","og_site_name":"TeamDesk Blog","article_published_time":"2017-11-02T14:32:15+00:00","article_modified_time":"2017-11-02T14:40:41+00:00","og_image":[{"width":1547,"height":821,"url":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg","type":"image\/jpeg"}],"author":"Kirill Bondar","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirill Bondar","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#article","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/"},"author":{"name":"Kirill Bondar","@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"headline":"Script to run on every page of your database","datePublished":"2017-11-02T14:32:15+00:00","dateModified":"2017-11-02T14:40:41+00:00","mainEntityOfPage":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/"},"wordCount":217,"commentCount":2,"image":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#primaryimage"},"thumbnailUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg","articleSection":["What's New"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/","url":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/","name":"Script to run on every page of your database - TeamDesk Blog","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#primaryimage"},"image":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#primaryimage"},"thumbnailUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg","datePublished":"2017-11-02T14:32:15+00:00","dateModified":"2017-11-02T14:40:41+00:00","author":{"@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"description":"TeamDesk is now able to run custom script on every database page. Just add file named dbscript.js to resources section of your database.","breadcrumb":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#primaryimage","url":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg","contentUrl":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2017\/11\/dbscript.jpg","width":1547,"height":821,"caption":"script and css to load on the page"},{"@type":"BreadcrumbList","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/database-pages-run-script\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.teamdesk.net\/blog\/"},{"@type":"ListItem","position":2,"name":"Script to run on every page of your database"}]},{"@type":"WebSite","@id":"https:\/\/www.teamdesk.net\/blog\/#website","url":"https:\/\/www.teamdesk.net\/blog\/","name":"TeamDesk Blog","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.teamdesk.net\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2","name":"Kirill Bondar","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/dc5bc844095b5753ccc73c589c028bf16615674f289668146bbd59205a08a52d?s=96&d=mm&r=g","caption":"Kirill Bondar"},"url":"https:\/\/www.teamdesk.net\/blog\/author\/kirill-bondar\/"}]}},"_links":{"self":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/1331","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/comments?post=1331"}],"version-history":[{"count":6,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/1331\/revisions"}],"predecessor-version":[{"id":1339,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/1331\/revisions\/1339"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/media\/1332"}],"wp:attachment":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/media?parent=1331"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/categories?post=1331"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/tags?post=1331"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}