Using JQuery in ISML Templates

jQuery is frequently used in ISML templates, with many examples in the SiteGenesis application. Salesforce B2C Commerce supports versions up to and including jQuery 1.3.2.

Both SiteGenesis and the Storefront Toolkit use jQuery 1.3.2. SiteGenesis also uses jQuery UI 1.7. Avoid using the # character in jQuery or JavaScript because it's reserved in ISML templates and can cause problems.

Note: Generally, if you follow the best practices of unobtrusive JavaScript and progressive enhancement, you will not mix HTML and JavaScript behavior, so this is unnecessary.

However, there might be cases where you need to use the # character. In these cases, instead of the following code:

<a id="id-to-select" href="...">...</a>

<script type="text/javascript">
jQuery("#id-to-select").click(function() {
    // Code here
});
</script>

Use the following code:

<script type="text/javascript">
jQuery("a[id='id-to-select']").click(function() {
    // Code here
});
</script>

Alternatively, the following notation:

<a href="#">Link</a>
is correctly written in ISML as
<a href="${'#'}">Link</a>
Note: Using multiple versions of jQuery in your project can cause changes to the behavior of SiteGenesis functionality.