A version of this information can be found in the comments in advancedSearch.tmpl.html. Since the template files are pure html, any html or angularjs control can be used. Information regarding angularjs controls may be found at https://docs.angularjs.org/api. In order for a control to properly databind with the controller, however, some rules must be followed.

The advanced search and search pages use the url parameter customCriteria to hold custom input data. As such, all databound controls must store their parameter data as attributes of customCriteria, such as by using data-ng-model=”customCriteria.exampleKey”.

The advanced search controller imports all data from facets.xml. Any facets that are not used by out of box controls are stored in an object called customfacets. To access a facet in customFacets, reference it as customFacets.key, where key is the facetKey from the desired top-level facet in facets.xml.

A few annotated examples are provided here and in advancedSearchCustomControls.tmpl.html.

To add a new row like the existing rows, copy this fieldRow div, and replace the input in the inputSpan div with your own control.data-ng-model, which is critical for binding the control to the controller so that the inputted data is stored. It must be formatted as ‘customCriteria' followed by the desired parameter key. This is the same key that is passed to the server in the $filters part of the search request.

There are 2 ways of populating options in a select element. The first, as seen here, is to hard code a series of option elements within the select

The second way is to specify a list of options to iterate through from facets.xml. In the example below, facetKey and key should be replaced with the facetKey of the custom facet from facets.xml (and must be preceded by ‘customOptions.' in the data-ng-options string), 'option' is a placeholder iterator variable, label is the attribute from facets.xml that is displayed in the control, and key is the facetKey attribute from facets.xml that will also be used as the key to pass the filter data to the server in the search request. To insert an empty/unselected option, you may create a single empty option element, as seen here.

Multiselect is a control designed for PTC Arbortext Content Delivery. To use it, copy this control, and modify as needed.

Multiselect controls must be populated with data from facets.xml.Multiselect. Controls take up the whole row they are put in, and can optionally create their own left side label by specifying title-text.Column-size, which tells the multiselect how many options should be in a column before generating a new column. This works a little differently if any of the options have sub-options. In that case, column-size will be honored unless the last option in a column has more sub-options than would ordinarily fit in a column. In that case, all sub-options will remain in the starting column, and the next column will start with the next top-level option. The elements selected-param-amount, url-param, and value-set must contain the exact values as indicated. FacetKey must be replaced in all cases with the actual facetKey of the facet you want to connect to the control.url-Param is used in place of data-ng-model to store the key used to pass the selected values in the search request $filters parameter.