<script type="edgeside/conditional" ...>The conditional element is used where we wish to either include or not include some part of a page, depending on a conditional expression which can refer to the element's input data.
The element will evaluate the given expression, on the edge. If the expression evaluates to 'true' the contents of this element will be processed exactly as it would have been if this element were not there. If the expression evaluates to 'false', the contents of the element will be skipped. In this case any HTML content of the element will not be rendered, and any other EdgeSide elements in this content will not be processed.
Expressions are evaluated using a parser based on JSEP, which supports any valid JavaScript expression, but not statements or blocks of code. The result of an expression is interpreted as a boolean using normal JavaScript behaviour.
| Name | Description | Required? |
|---|---|---|
| data-edgeside-input | specifies a key under which it should expect to find data | yes |
| data-edgeside-expression | a javascript expression which evaluates to a boolean and can refer to any data available under the given key | yes |
Any arbitrary HTML content, possibly including other edgeside elements.
Here we use data about the HTTP request, from the Request Data element. We want to display different content depending on the country that the request has come from. We use two conditional elements to wrap our two different fragments of content. Note here that the two conditional elements show two alternative ways to use the quote character in an attribute. We accept the literal ' character, as in the second conditional element here, but some platforms may prefer to output the more technically correct html entity reference ', as in the first, which we will decode.
<script type="edgeside/request-data"
data-edgeside-output="requestData">
</script>
<script type="edgeside/conditional"
data-edgeside-input="requestData"
data-edgeside-expression="headers['cf-ipcountry'] === 'GB'"
>
<h2>It looks like you are in the UK</h2>
</script>
<script type="edgeside/conditional"
data-edgeside-input="requestData"
data-edgeside-expression="headers['cf-ipcountry'] !== 'GB'"
>
<h2>It looks like you are somewhere outside the UK</h2>
</script>