Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

Personlisation within Javascript

NickC_
Level 2
Level 2

Hi all,

Struggling to get this one to work, hoping someone here can assist.

I have a personlisation block with some java-script in it, i only want the block to display if the dates are valid:

<%

//declare start and end date for block

var startDate1 = '2019-08-01'; // start date for block1 - following format YYYY-MM-DD

var expiryDate1 = '2019-08-31'; // end date for block1 - following format YYYY-MM-DD

var today = new Date();

expiryDate1 = new Date(expiryDate1);

startDate1 = new Date(startDate1);

var htmlBlock1 =

<table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="width:100%; min-width:100%; max-width:600px; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

  <tr>

    <td class="flex" align="center" style="Margin: 0;padding-left: 0;padding-right: 0;padding-top: 0px;padding-bottom: 0px;" valign="middle" bgcolor="#000000">

      <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="600" style="width:100%; min-width:100%; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

        <tr>

          <td align="center" style="padding:0; Margin:0"><a style="text-decoration: none;font-weight: bold;font-size: 18px;color: #000001" target="_blank" href=""><img class="flex" src="" alt="Say it with a personalised gift card. Buy a gift card" style="border: none;display: block;height: auto;width: 100%;max-width: 600px;" width="600" border="0" /></a><br/><br/>           

          </td>

        </tr>

      </table>

    </td>

  </tr>

</table>

if(startDate1 <= today && expiryDate1 >= today ) {

  document.write(htmlBlock1)

    

} else {

};

%>

This works fine without any issues however, i want to put an IF statement into the html variable that will change based on the targetData coming into the delivery. for example:

var htmlBlock1 =

<% if ( targetData.christmas == 1 ) { %>

<table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="width:100%; min-width:100%; max-width:600px; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

  <tr>

    <td class="flex" align="center" style="Margin: 0;padding-left: 0;padding-right: 0;padding-top: 0px;padding-bottom: 0px;" valign="middle" bgcolor="#000000">

      <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="600" style="width:100%; min-width:100%; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

        <tr>

          <td align="center" style="padding:0; Margin:0"><a style="text-decoration: none;font-weight: bold;font-size: 18px;color: #000001" target="_blank" href=""><img class="flex" src="" alt="Say it with a personalised gift card. Buy a gift card" style="border: none;display: block;height: auto;width: 100%;max-width: 600px;" width="600" border="0" /></a><br/><br/>           

          </td>

        </tr>

      </table>

    </td>

  </tr>

</table>

<% } %>

when i do this, the delivery fails:

Error while compiling script 'content htmlContent' line ...: illegal XML character

I believe this is because the opening and closing tags (<% %>) is breaking my javascript as that is also within <% %>.

Is this possible? what can i do to make it work?

Thanks

Nick

1 Accepted Solution
Anita_p
Correct answer by
Community Advisor
Community Advisor

Hi Nick,

If I understand your requirement correctly, your var htmlBlock1 depends upon ( targetData.christmas == 1 ) condition.

You can try below in your delivery:

<%

var htmlBlock1 = ' ' ;

if ( targetData.christmas == 1 )

{

var htmlBlock1 = <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="width:100%; min-width:100%; max-width:600px; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

  <tr>

    <td class="flex" align="center" style="Margin: 0;padding-left: 0;padding-right: 0;padding-top: 0px;padding-bottom: 0px;" valign="middle" bgcolor="#000000">

      <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="600" style="width:100%; min-width:100%; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

        <tr>

          <td align="center" style="padding:0; Margin:0"><a style="text-decoration: none;font-weight: bold;font-size: 18px;color: #000001" target="_blank" href=""><img class="flex" src="" alt="Say it with a personalised gift card. Buy a gift card" style="border: none;display: block;height: auto;width: 100%;max-width: 600px;" width="600" border="0" /></a><br/><br/>          

          </td>

        </tr>

      </table>

    </td>

  </tr>

</table>

}

%>

-- HTML Content --

You can call this variable in the HTML content using <%= htmlBlock1 %>

Hope this helps.

Thanks,

Anita

View solution in original post

1 Reply
Anita_p
Correct answer by
Community Advisor
Community Advisor

Hi Nick,

If I understand your requirement correctly, your var htmlBlock1 depends upon ( targetData.christmas == 1 ) condition.

You can try below in your delivery:

<%

var htmlBlock1 = ' ' ;

if ( targetData.christmas == 1 )

{

var htmlBlock1 = <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="100%" style="width:100%; min-width:100%; max-width:600px; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

  <tr>

    <td class="flex" align="center" style="Margin: 0;padding-left: 0;padding-right: 0;padding-top: 0px;padding-bottom: 0px;" valign="middle" bgcolor="#000000">

      <table class="flex" cellspacing="0" cellpadding="0" border="0" align="center" width="600" style="width:100%; min-width:100%; mso-cellspacing: 0px; mso-padding-alt: 0px 0px 0px 0px">

        <tr>

          <td align="center" style="padding:0; Margin:0"><a style="text-decoration: none;font-weight: bold;font-size: 18px;color: #000001" target="_blank" href=""><img class="flex" src="" alt="Say it with a personalised gift card. Buy a gift card" style="border: none;display: block;height: auto;width: 100%;max-width: 600px;" width="600" border="0" /></a><br/><br/>          

          </td>

        </tr>

      </table>

    </td>

  </tr>

</table>

}

%>

-- HTML Content --

You can call this variable in the HTML content using <%= htmlBlock1 %>

Hope this helps.

Thanks,

Anita

View solution in original post