{"id":80,"date":"2011-01-27T07:52:20","date_gmt":"2011-01-27T13:52:20","guid":{"rendered":"http:\/\/www.teamdesk.net\/blog\/2011\/01\/formulaxhtml\/"},"modified":"2011-01-27T07:52:20","modified_gmt":"2011-01-27T13:52:20","slug":"formulaxhtml","status":"publish","type":"post","link":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/","title":{"rendered":"Formula &#8211; XHTML"},"content":{"rendered":"<p>There are small number of scenarios that go way beyond rich capabilities provided by <a href=\"http:\/\/www.teamdesk.net\">TeamDesk<\/a>. One is conditional formatting of column&#39;s values.<\/p>\n<p>Formula \u2013 XHTML is introduced to provide the way to decorate the value with tags and styles. It is a mixture of limited (X)HTML markup and TeamDesk formula language.<\/p>\n<p>Using Formula \u2013 XHTML you can write HTML markup as is, decorating TeamDesk formula pieces (<em>code points<\/em>) with &lt;%\u2026%&gt; marks; those of you who dealt with ASP should be familiar with the syntax. Each formula piece is evaluated, the result of evaluation is properly encoded and inserted in the markup.<\/p>\n<p>Code points can appear inside attribute values and\/or in tag contents, no dynamic tag generation is allowed. We designed it this way to ensure the formula result is a well formed HTML and won&#39;t affect the rest of page&#39;s content.<\/p>\n<p>Here are typical usage examples for the formula:<\/p>\n<p style=\"text-align: left\">1. Decorate contacts name as a e-mail link:<\/p>\n<p style=\"text-align: left\"><font color=\"#c0504d\">&lt;a href=&quot;<\/font><font style=\"background-color: #ffff00\">&lt;%<\/font><font style=\"style\"> <font color=\"#0000ff\">Nz(<\/font><\/font><font style=\"background-color: #ffff00\"><\/font><font color=\"#0000ff\">&quot;mailto:&quot; &amp; [E-Mail])<\/font> <font style=\"background-color: #ffff00\">%&gt;<\/font><font color=\"#c0504d\">&quot;&gt;<\/font><font style=\"background-color: #ffff00\">&lt;%<\/font><font style=\"style\"> <\/font><font style=\"background-color: #ffff00\"><\/font><font color=\"#008000\">[Name]<\/font> <font style=\"background-color: #ffff00\">%&gt;<\/font><font color=\"#c0504d\">&lt;\/a&gt;<\/font><\/p>\n<p>Behind the scenes Formula \u2013 XHTML creates text formula: a concatenation of markup code and formula results enclosed in HTML encoding function, such as the code below produced from the example:<\/p>\n<p><font color=\"#c0504d\">&quot;&lt;a href=\\&quot;&quot;<\/font> <font style=\"background-color: #ffff00\">&amp; Encode(<\/font><font color=\"#0000ff\">Nz(&quot;mailto:&quot; &amp; [E-Mail])<\/font><font style=\"background-color: #ffff00\">) &amp;<\/font> <font color=\"#c0504d\">&quot;\\&quot;&gt;&quot;<\/font> <font style=\"background-color: #ffff00\">&amp; Encode(<\/font><font color=\"#008000\">[Name]<\/font>)<font style=\"background-color: #ffff00\"> &amp;<\/font> <font color=\"#c0504d\">&quot;&lt;\/a&gt;&quot;<\/font><\/p>\n<p>2. Color the value red if it is less than 100:<\/p>\n<p style=\"text-align: left\"><font color=\"#c0504d\">&lt;span style=&quot;<\/font><font style=\"background-color: #ffff00\">&lt;%<\/font><font color=\"#666666\"> If([Value] &lt; 100, &quot;color:red&quot;, &quot;&quot;) <\/font><font style=\"background-color: #ffff00\">%&gt;<\/font><font color=\"#c0504d\">&quot;&gt;      <br \/><\/font><font style=\"background-color: #ffff00\">&lt;%=<\/font><font color=\"#666666\"> <font style=\"background-color: #ffff00\"><\/font>[Value] <\/font><font style=\"background-color: #ffff00\">%&gt;     <br \/><\/font><font color=\"#c0504d\">&lt;\/span&gt;<\/font><\/p>\n<p>Be aware of the way concatenation handles NULL values \u2013 if one of the parts is NULL whole result is also NULL \u2013 first example produce no markup at all when the value of [Name] is blank. While it is useful in some scenarios, enclosing each and every field you want to display in a sort of NULL checks is a cumbersome task. To handle this case we created a shorthand for code points containing a sole reference to a column, a <font style=\"background-color: #ffff00\">&lt;%=<\/font><font style=\"style\"> <\/font><font style=\"style\">[Column]<\/font><font style=\"style\"> <\/font><font style=\"background-color: #ffff00\">%&gt;<\/font>. It creates Nz() wrapper so that NULL values produce empty strings that can be safely concatenated; numbers, dates, times and timestamps are converted to text via <a href=\"http:\/\/blog.teamdesk.net\/2011\/01\/formulas-formatting-string-validation.html\" target=\"_blank\">locale-aware Format()<\/a> function, other types converted via ToText(). In second example, <font style=\"background-color: #ffff00\">&lt;%=<\/font><font color=\"#666666\"> <font style=\"background-color: #ffff00\"><\/font>[Value] <\/font><font style=\"background-color: #ffff00\">%&gt;<\/font><font style=\"style\"> produces <font style=\"background-color: #ffff00\">Encode(Nz(Format(<\/font><\/font><font style=\"style\"><font style=\"style\"> <\/font><\/font><font style=\"style\"><font style=\"background-color: #ffff00\"><\/font>[Value] <font style=\"background-color: #ffff00\">)))<\/font>.<\/font><\/p>\n<p><!--more--><\/p>\n<p>The usage of HTML and Formula \u2013 XHTML is somewhat limited due to technical reasons.<\/p>\n<p>1. Markup will be displayed as text in:<\/p>\n<ul>\n<li>Dropdown lists, as dropdowns do not support markup; <\/li>\n<li>Calendar views and Lookup columns with &quot;Display As Link&quot; options checked, as very limited set of tags can be displayed inside of link;<\/li>\n<li>Documents as Word file format has no connection to HTML;<\/li>\n<\/ul>\n<p>2. Some tags are disabled to avoid interference with the rest of the page: <\/p>\n<p>&lt;html&gt;, &lt;head&gt;, &lt;script&gt;, &lt;noscript&gt;, &lt;title&gt;, &lt;meta&gt;, &lt;link&gt;, &lt;base&gt;, &lt;style&gt;, &lt;body&gt;, &lt;form&gt;, &lt;input&gt;, &lt;isindex&gt;, &lt;textarea&gt;, &lt;select&gt;, &lt;optgroup&gt;, &lt;option&gt;, &lt;fieldset&gt;, &lt;legend&gt;.<\/p>\n<p>&lt;button&gt; tag is allowed only when its type attribute is set to &quot;button&quot;.<\/p>\n<p>3. All allowed tags require closing tag, even if it is not required by HTML. For example, in HTML you can write:<\/p>\n<p>&lt;p&gt;First paragraph    <br \/>&lt;p&gt;Second paragraph<\/p>\n<p>In formula code you should closing <strong>&lt;\/p&gt;<\/strong> tag before opening new &lt;p&gt; tag:<\/p>\n<p> &lt;p&gt;First paragraph&lt;\/p&gt;   <br \/>&lt;p&gt;Second paragraph&lt;\/p&gt;   <\/p>\n<p>4. Tags that can not have inner content, such as &lt;img&gt;, &lt;br&gt;, &lt;hr&gt; and &lt;param&gt; should be self-closed, e.g. written as &lt;br<strong>\/<\/strong>&gt; or &lt;img src=&quot;image.gif&quot;<strong>\/<\/strong>&gt;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>There are small number of scenarios that go way beyond rich capabilities provided by TeamDesk. One is conditional formatting of column&#39;s values. Formula \u2013 XHTML is introduced to provide the way to decorate the value with tags and styles. It is a mixture of limited (X)HTML markup and TeamDesk formula language. Using Formula \u2013 XHTML [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-80","post","type-post","status-publish","format-standard","hentry","category-whats-new"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Formula - XHTML - TeamDesk Blog<\/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:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Formula - XHTML - TeamDesk Blog\" \/>\n<meta property=\"og:description\" content=\"There are small number of scenarios that go way beyond rich capabilities provided by TeamDesk. One is conditional formatting of column&#039;s values. Formula \u2013 XHTML is introduced to provide the way to decorate the value with tags and styles. It is a mixture of limited (X)HTML markup and TeamDesk formula language. Using Formula \u2013 XHTML [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/\" \/>\n<meta property=\"og:site_name\" content=\"TeamDesk Blog\" \/>\n<meta property=\"article:published_time\" content=\"2011-01-27T13:52:20+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2024\/01\/logo_og.png\" \/>\n\t<meta property=\"og:image:width\" content=\"600\" \/>\n\t<meta property=\"og:image:height\" content=\"315\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\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=\"3 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\\\/formulaxhtml\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/\"},\"author\":{\"name\":\"Kirill Bondar\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"headline\":\"Formula &#8211; XHTML\",\"datePublished\":\"2011-01-27T13:52:20+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/\"},\"wordCount\":657,\"commentCount\":0,\"articleSection\":[\"What's New\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/\",\"url\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/\",\"name\":\"Formula - XHTML - TeamDesk Blog\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#website\"},\"datePublished\":\"2011-01-27T13:52:20+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/#\\\/schema\\\/person\\\/22c4c05bd657513c8b00122fa364c8d2\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/whats-new\\\/formulaxhtml\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.teamdesk.net\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Formula &#8211; XHTML\"}]},{\"@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":"Formula - XHTML - TeamDesk Blog","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\/formulaxhtml\/","og_locale":"en_US","og_type":"article","og_title":"Formula - XHTML - TeamDesk Blog","og_description":"There are small number of scenarios that go way beyond rich capabilities provided by TeamDesk. One is conditional formatting of column&#39;s values. Formula \u2013 XHTML is introduced to provide the way to decorate the value with tags and styles. It is a mixture of limited (X)HTML markup and TeamDesk formula language. Using Formula \u2013 XHTML [&hellip;]","og_url":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/","og_site_name":"TeamDesk Blog","article_published_time":"2011-01-27T13:52:20+00:00","og_image":[{"width":600,"height":315,"url":"https:\/\/www.teamdesk.net\/blog\/wp-content\/uploads\/2024\/01\/logo_og.png","type":"image\/png"}],"author":"Kirill Bondar","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Kirill Bondar","Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/#article","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/"},"author":{"name":"Kirill Bondar","@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"headline":"Formula &#8211; XHTML","datePublished":"2011-01-27T13:52:20+00:00","mainEntityOfPage":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/"},"wordCount":657,"commentCount":0,"articleSection":["What's New"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/","url":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/","name":"Formula - XHTML - TeamDesk Blog","isPartOf":{"@id":"https:\/\/www.teamdesk.net\/blog\/#website"},"datePublished":"2011-01-27T13:52:20+00:00","author":{"@id":"https:\/\/www.teamdesk.net\/blog\/#\/schema\/person\/22c4c05bd657513c8b00122fa364c8d2"},"breadcrumb":{"@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.teamdesk.net\/blog\/whats-new\/formulaxhtml\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.teamdesk.net\/blog\/"},{"@type":"ListItem","position":2,"name":"Formula &#8211; XHTML"}]},{"@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\/80","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=80"}],"version-history":[{"count":0,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/posts\/80\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/media?parent=80"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/categories?post=80"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.teamdesk.net\/blog\/wp-json\/wp\/v2\/tags?post=80"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}