Search

Guys,

I’m trying to populate a field with jQuery Autocomplete but the script is giving XSLT error, as I could see, because of the if element.

Somebody has any idea of how to get this working?

And, there’s any way for me to break the script code in parts with in order to generate the list of options via XSL and not via an external JSON?

Something like this

<xsl:text disable-output-escaping="yes">
&lt;script&gt;
$(function() {
        var availableTags = [
</xsl:text>
<xsl:for-each select="entry">
    <xsl:text>"</xsl:text><xsl:value-of select="item"/><xsl:text>",</xsl:text>
</xsl:for-each>
<xsl:text disable-output-escaping="yes">
...the rest of the code
&lt;/script&gt;
</xsl:text>

Whoa, how freaky, I just downloaded this exact extension from jQuery about an hour ago for a work project!

It would be quite easy with Symphony to do this.

  1. Create a datasource that outputs only the field that you need to see in the list.
  2. Create a page that has a random name (like a hash) so that you can keep it hidden from snooping users, also set the type to hidden and attach the datasource
  3. In the page xsl, just transform the datasource output into a list with one word on each line (very easy to do, see my XSLT example).
  4. Hand code the Javascript into a JS file, and point it at the URL for the page, then attach it to your page, et voila!

The XSLT you need would be something like this

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output method="text" />

    <xsl:template match="data/datasource-name/entry">
        <xsl:apply-templates select="your-field-name" />
    </xsl:template>

    <xsl:template match="entry/your-field-name">
        <xsl:value-of select="./text()" />
        <xsl:if test="not(position() = last()">
            <xsl:text>&#xA;</xsl:text>
        </xsl:if>
    </xsl:template>

</xsl:stylesheet>

It may seem like a long way round, but it’s the safest route IMO, and you don’t have to fight with XSLT trying to output JavaScript

Thanks designermonkey. I found a quite similar way to achieve the results too. Nevertheless, any thoughts about the IF issue?

I’m not sure I follow. Where is the if that you talk about?

This in the middle:

$( "#tags" )
        // don't navigate away from the field on tab when selecting an item
        .bind( "keydown", function( event ) {
            if ( event.keyCode === $.ui.keyCode.TAB &&
                    $( this ).data( "autocomplete" ).menu.active ) {
                event.preventDefault();
            }
        })

Ah! I see. It is missing from the initial post. Could you update it to include this bit?

I don’t think you can put comments in the middle of dot notation can you? I may be wrong.

Also not got enough experience with jQuery yet to really comment.

That’s the jQuery given code, see: jQueryUI Autocomplete - Click on: View source

It works fine in normal HTML, just doesn’t on XSL.

Have you tried wrapping it in cdata tags?

Create an account or sign in to comment.

Symphony • Open Source XSLT CMS

Server Requirements

  • PHP 5.3-5.6 or 7.0-7.3
  • PHP's LibXML module, with the XSLT extension enabled (--with-xsl)
  • MySQL 5.5 or above
  • An Apache or Litespeed webserver
  • Apache's mod_rewrite module or equivalent

Compatible Hosts

Sign in

Login details