How to set a query pattern using the queryExpr property in the djFilteringSelect control in XPages

Question

I am trying to tweak the djFilteringSelect control in XPages so that when a user type a query it finds any occurance of the char sequence, not just from the beginning.

so if the selectitems contain a value "this is a product" and I type product it should be a match. the default is that it only searches from the beginning of the text.

there is a queryExpr property that can be used for this but the documentation is lacking for use in XPages. I have tried the following and a lot others but cannot get it to work.

<xe:this.queryExpr><![CDATA[#{javascript:"*{0}*"}]]></xe:this.queryExpr>
<xe:this.queryExpr><![CDATA[#{javascript:"$*{0}*"}]]></xe:this.queryExpr>

<xe:djFilteringSelect id="djFilteringSelect1">
<xp:selectItems id="selectItems2">
    <xp:this.value><![CDATA[#{javascript:var products = @DbLookup("","LookUp", "Produkt", 2);
products = @Unique(@Trim(products));
return products.sort();}]]></xp:this.value>
                        </xp:selectItems>
</xe:djFilteringSelect>

here is a complete example if anyone want to copy/paste into a new XPage, I want to type "x" and the entry "my name is x" should show up

<?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
    xmlns:xc="http://www.ibm.com/xsp/custom"
    xmlns:xe="http://www.ibm.com/xsp/coreex">
    
    <xe:djFilteringSelect id="djFilteringSelect1">
        
        <xp:selectItem itemLabel="my name is x"></xp:selectItem>
        <xp:selectItem itemLabel="my name is y"></xp:selectItem>
        <xp:selectItem itemLabel="my name is z"></xp:selectItem>
    </xe:djFilteringSelect>
</xp:view>

Answer 1

We use djFilteringSelect in our application and it's working as intented. The only point to note is that some characters in the string must be escaped: therefore the correct values for queryExpr is "*\$\{0\}*".

The explanation why $ and {} must be escaped can be found here https://xcellerant.wordpress.com/2014/07/22/changing-search-behavior-of-dojo-filtering-select-in-xpages/

Answer 2

djFilteringSelect is just a wrapper for the Dojo FilteringSelect component, so queryExpr and searchExpr are just used to pass to the underlying (client-side) JavaScript code. So for documentation, Dojo site is a good source. According to the API documentation *${0}* should do what you want (https://dojotoolkit.org/api/?qs=1.6/dijit/form/FilteringSelect). The docs talk about combining with highlightMatch to define what's highlighted.