Custom Search

(Page 1)

Custom Search with Record Filter

Overview

In this lesson, we will configure Form and List module to display only records that match a search query input into a basic search control that's been customized from an auto-generated XSL created by Form and List.

On a page named 'form-and-list.aspx' we have an instance of Form and List that has two columns:

Column Title	Contains	Column Type
Country	Country Name	Text
Wiki	Wiki Address	URL

In 'Data Table Setup', be sure to enable 'Searchable' for the Country column. In the Form and List module, if you don't enable at least one column as 'Searchable', enabling a setting to display a search box will have no effect.

(page 2)

missing

(page 3)

Using XSL Generator/Editor to Create a Script

In this step, we 'Add Existing Module' to put the Form and List instance from the 'form-and-list.aspx' page onto a new page named 'form-and-list-search.aspx'. After we 'Add Module to Page', we select 'Form and List Configuration' from the module menu. Under 'List Settings', choose 'Rendering Method: XSLT using self made or generated stylesheets', then choose 'Generate New'.

Expand the 'Options' section, then enable the setting for 'Add Search Box to the Style Sheet'. Click the button to 'Generate from HTML Template' to have the XSL Generator/Editor make XSL code from the HTML template.

(page 4)

Using XSL Editor to Modify the Script

Scan the XSL looking for the select statement that contains search code:

<xsl:template match="/udt:UserDefinedTable">
    <xsl:variable 
           name="searchColumns" 
           select="//udt:Fields[udt:Searchable='true']/udt:ValueColumn" />
    <xsl:if test="//udt:Fields[udt:Searchable='true']">
      <xsl:call-template name="SearchForm" />
    </xsl:if>
    <xsl:variable 
      name="currentData" 
      select="udt:Data[contains(*[name()=$searchColumns][1],$search) 
       or contains(*[name()=$searchColumns][2],$search) 
       or contains(*[name()=$searchColumns][3],$search) 
       or contains(*[name()=$searchColumns][4],$search) 
       or contains(*[name()=$searchColumns][5],$search)]" />
    <xsl:if test="$currentData">
      <table>
        <xsl:apply-templates select="$currentData" mode="list">
        </xsl:apply-templates>
      </table>
    </xsl:if>
</xsl:template>

... and edit the select statement, removing most of the code so that it looks like this:

<xsl:template match="/udt:UserDefinedTable">
    <xsl:variable 
         name="searchColumns" 
         select="//udt:Fields[udt:Searchable='true']/udt:ValueColumn" />
    <xsl:if test="//udt:Fields[udt:Searchable='true']">
      <xsl:call-template name="SearchForm" />
    </xsl:if>
    <xsl:variable name="currentData" select="udt:Data" />
    <xsl:if test="$currentData">
      <table>
        <xsl:apply-templates select="$currentData" mode="list">
        </xsl:apply-templates>
      </table>
    </xsl:if>
</xsl:template>

(page 5)

Filter on Custom Search Form

Identify the Form and List module ID by editing one of your records, then checking the number that follows '/mid/' in the URL:

e.g. http://www.example.com/form-and-list-search/tabid/131/ctl/edit/mid/539/Default.aspx?UserDefinedRowId=16078

Under the List Settings > Filter Statement setting, enter a filter condition that uses the [Form:ModuleID] token. In this example, we search on the Country column to list all records that match our query condition. We also add to this filter the LEN() function to be sure a minimum number of characters (> 4) are entered for the search query before any results are returned:

[Country] LIKE '*[Form:udt_539_param_searchPostback]*' AND LEN('[Form:udt_539_param_searchPostback]') > 4