Understanding Search Server Controls

Modifying the Default Markup

InputView and ResultsView controls have a corresponding .ascx template that contains their default markup. To change a control's default markup, modify its template.

To find a control's template file, open the folder siteroot\workarea\FrameworkUI\Templates\Search, and locate the .ascx file that matches the control's name. For example, siteroot\workarea\FrameworkUI\Templates\Search\SiteSearchResultsView.ascx.

NOTE: "Controller"controls only process data. Because they have no UI component, they do not have a template file.

The default .ascx file affects all instances of a control on your Web site. However, you may customize single instances of a control. To do so, see Customizing a single instance of a templated search server control.

Customizing a single instance of a templated search server control

1. Open a page in Visual Studio.
2. Drag an InputView or a ResultsView control onto the page. This section uses the SiteSearchResultsView server control as an example.
3. Insert <ItemTemplate> tags between the control's opening and closing tags. <ItemTemplate> tags instruct the server control to ignore the default properties.
   

   <ektron:SiteSearchResultsView ID="SiteSearchInputView1" 
     ControllerID="Scontroller" Visible="true" runat="server">
   	<ItemTemplate>
   	</ItemTemplate>
   </ektron:SiteSearchResultsView>

4. Copy the default markup from the control's corresponding .ascx file. Here is a portion of that.
   

   <ektron:SiteSearchResultsView ID="SiteSearchInputView1" 
     ControllerID="Scontroller" Visible="true" runat="server"> 
     <ItemTemplate> 
     <h1> Search Phrase:<%# Eval("QueryText") %> </h1> 
     <asp:ListView ID="aspResults" runat="server" 
       DataSource='<%# Eval("Results") %>' 
       ItemPlaceholderID="aspPlaceholder"> 
       <layouttemplate> 
         <ul class="results"> 
           <asp:PlaceHolder ID="aspPlaceholder" runat="server">
           </asp:PlaceHolder> 
         </ul> 
       </layouttemplate> 
       <itemtemplate> 
       <li class="result ektron-ui-clearfix"> 
       <h3 class="title">
         <a href="<%# Eval("Url") %>"><%# Eval("Title") %></a>
       </h3> 
       <div class="summary">
         <%# Eval("Summary") %>
       </div> <span class="url ektron-ui-quiet">
       <%# Eval("Url") %></span> 
       <span class="date ektron-ui-quiet">
       <%# Eval("Date") %></span> 
       </li> 
       </itemTemplate> 
       </Itemtemplate> 
     </asp:ListView> 
   </ektron:SiteSearchResultsView>

5. Modify the markup to your specifications.

Modifying a Templated Control's Markup

Within an </ItemTemplate> tag, use an eval statement <%# Eval() >) to access Ektron's Search API object and expose its properties to the data binder. For example, <%# Eval (“QueryText”)%> displays the search term in the search results.

As an example, you can remove the summary from the search results by deleting this line.

<div class="summary"><%# Eval("Summary") %></div>

Data Fields Available to an Eval Statement

Use an <%# Eval()> statement to determine which field properties appear in search results. For example, <%# Eval("Summary")%> displays each content item's summary.

When you insert <%# Eval()> between a set of </ItemTemplate> tags, a model is passed to the statement. Each set of controls has a model that determines available fields and properties. For example, the SearchModel's Results property includes these fields:

• Date (late edited)
• Summary
• Title
• Type
• Url

Documentation for Data Fields and Properties

Documentation for Data Fields and Properties

The following topics list each model's fields and properties.

• SiteSearch Model Properties
• UserSearch Model Properties
• ProductSearch Model Properties
• The Search Model for XML Smart Forms

Discovering a model's fields using the object browser

Discovering a Model's Fields Using the Object Browser

1. Open your Ektron Web site within Visual Studio.
2. Open the Object Browser.
3. In the Browse field, enter the set of controls whose model you want to view. For example, ProductSearchModel.

   Other models are SearchModel (covers content and XML Smart Forms) and UserSearchModel. The model's fields appear in the right pane.

   —Image—

   

4. To view any field's properties, enter its name into the object browser. Omit the angle brackets (<>).
   

   

   

Modifying the Text Displayed by Templated Server Controls

To modify the text displayed by a templated control (for example, no results found), edit the corresponding .resx file in the siteroot\workarea\FrameworkUI\Templates\Search\app_loclaresources folder.

For example, to edit text supplied by the Site Search template, edit siteroot\workarea\FrameworkUI\Templates\Search\app_loclaresources\SiteSearchInputView.ascx.resx.

Properties

• ID (Required)—provides the association for the SiteSearchInputView and SiteSearchResultsView server controls. here is an example of the ID property with the SiteSearchController.

  <ektron:SiteSearchController ID="SiteSearchController1" runat="server" />

• AdvancedQueryText (Optional)—see Displaying Search Results Using a ListView Control

Inserting Search Server Controls

To provide search capabilities to your Web site content, insert all 3 controls onto an .aspx template. Because the search functions are managed by separate controls, you can place a search field and button in a one section of a page, and the results in another.

Also, unless you want to use the default paging properties (which show only 10 results), insert an EktronUI Pager control on the page to manage the paging of the search results.

Prerequisite: Search server controls were added to the Visual Studio Toolbox. See Adding Search Server Controls to Visual Studio.

If you drag and drop controls from the VS Toolbox, the necessary register statements are copied from the web.config file and added to the page.

<add tagPrefix="ektron" namespace="Ektron.Cms.Framework.UI.Controls" 
  assembly="Ektron.Cms.Framework.UI.Controls, Version=8.5.0.356, 
  Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />
<add tagPrefix="ektronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  assembly="Ektron.Cms.Framework.UI.Controls.EktronUI, 
  Version=8.5.0.356, Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />

If you copy and paste the sample code, add the following register statement for templated controls:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" 
namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

For Ektron UI controls, use this register statement:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %>

The tag prefix can be anything as long as it matches the control's prefix.

Here is a basic template showing the 3 controls.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TemplatedControl.aspx.cs" 
Inherits="TemplatedControl" ValidateRequest="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
  <body> 
    <form id="form1" runat="server">
     <div>
       <ektron:SiteSearchInputView ID="SiteSearchInputView1" 
         ControllerID="SiteSearchController1" runat="server">
       </ektron:SiteSearchInputView>

       <ektron:SiteSearchController ID="SiteSearchController1" runat="server" />

       <ektron:SiteSearchResultsView ControllerID="SiteSearchController1" 
         ID="SiteSearchResultsView1" runat="server">
       </ektron:SiteSearchResultsView>
 
       <ektronUI:Pager ID="pager1" runat="server" 
         PageableControlID="SiteSearchController1" 
         ResultsPerPage="10"></ektronUI:Pager>

     </div>
    </form>  
  </body>
</html>	

SiteSearchInputView Server Control

The SiteSearchInputView server control provides a text box and submit button, which visitors use to search content. The control contains no business logic. It merely accepts a search term and passes it to the SiteSearchController, which retrieves and sends results to the SiteSearchResultsView control.

The SiteSearchInputView control's main purpose is a placeholder for markup, which you use to modify its appearance. The control's default markup is very simple: it inserts a text box, a Search button, and an Advanced Search link.

Placing a SiteSearchInputView server control on a page

Placing a SiteSearchInputView Server Control on a Page

Prerequisite: You added search server controls to the Visual Studio Toolbox. See Adding Search Server Controls to Visual Studio.

To place a SiteSearchInputView control on a page:

1. Open the page in Visual Studio.
2. Drag and drop the SiteSearchInputView control.

You can place the SiteSearchInputView control anywhere on a page -- it does not need to be next to the results.

Also, you can place several SiteSearchInputView controls on a page.

Connecting a SiteSearchController to a SiteSearchInputView control

Connecting a SiteSearchController to a SiteSearchInputView Control

To enable search functionality, connect a SiteSearchController to a SiteSearchInputView control. Use the control's controllerID property to do this.

As a value for the ControllerID property, enter the ID of the SiteSearchController that you place within the <form> tags. For example:

<ektron:SiteSearchInputView ID="SiteSearchInputView1" ControllerID="SiteSearchController1"
runat="server">
</ektron:SiteSearchInputView>

Customizing the SiteSearchInputView control

Customizing the SiteSearchInputView Control

See Also: Modifying Templated Server Controls

1. Add a set of <ItemTemplate> tags between the SiteSearchInputView control's opening and closing tags. Then, insert an asp text box or an EktronUI:TextField to accept the user's input. Here is an example.
   

   <ektron:SiteSearchInputView ID="SiteSearchInputView1" 
     ControllerID="SiteSearchController1" runat="server">
     <ItemTemplate>
        <ektronUI:TextField ID="queryText" Text='<%# Eval("QueryText") %>' 
           runat="server"></ektronUI:TextField>
     </ItemTemplate>
   </ektron:SiteSearchInputView>

   NOTE: As an alternative, you can copy the line that inserts a text box from siteroot\Workarea\FrameworkUI\Templates\Search\SiteSearchInputview.ascx.

   Note that the Eval statement (<%# Eval("QueryText") %>) databinds the search term to the textbox. As a result, the term remains in the box after the user clicks the search button.

2. Insert an asp search or EktronUI:Button, like this.
   

   <ektron:SiteSearchInputView ID="SiteSearchInputView1" 
     ControllerID="SiteSearchController1" runat="server">
     <ItemTemplate>
   	<ektronUI:TextField ID="queryText" Text='<%# Eval("QueryText") %>' 
            runat="server"></ektronUI:TextField>
   	<ektronUI:Button ID="Button1" DisplayMode="button" Text="Button 1" 
            runat="server" OnClick="Button1_Click">
          </ektronUI:Button>
     </ItemTemplate>
   </ektron:SiteSearchInputView>

   NOTE: As an alternative, you can copy the line that inserts a search button from siteroot\Workarea\FrameworkUI\Templates\Search\SiteSearchInputview.ascx.

3. Assign to the button an onclick event that executes a search. To accomplish this, open the page’s code-behind file and add the following code.
   

   protected void searchButton_Click(object sender, EventArgs e)
     { SiteSearchController1.Search (queryText.Text); }

Now you can customize the control's markup as needed.

See Also: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.aspx, http://msdn.microsoft.com/en-us/library/system.windows.controls.textbox.aspx

Separating the search field from the results display

Separating the Search Field from the Results Display

You can place the search field and button on different parts of the page. To do that, insert 2 SiteSearchInputView controls. In one control, place the search field, like this.

<ektron:SiteSearchInputView ID="SiteSearchInputView1" ControllerID="Scontroller"
  Visible="true" runat="server">
  <ItemTemplate>
	<ektronUI:TextField ID="queryText" Text='<%# Eval("QueryText") %>' 
          runat="server"></ektronUI:TextField>
  </ItemTemplate>
</ektron:SiteSearchInputView>

In the second control, in another section of the page, place the button, like this.

<ektron:SiteSearchInputView ID="SiteSearchInputView2" ControllerID="Scontroller"
  Visible="true" runat="server">
  <ItemTemplate>
	<ektronUI:Button ID="Button1" DisplayMode="button" Text="Button 1" 
         runat="server" OnClick="Button1_Click">
       </ektronUI:Button>
  </ItemTemplate>
</ektron:SiteSearchInputView>

Then, assign an onclick event to the button that executes a search. To accomplish this, open the page’s code-behind file and add the following code.

protected void searchButton_Click(object sender, EventArgs e)
	  {
   SiteSearchController1.Search (queryText.Text);

SearchResultsView Server Control

The SiteSearchResultsView Control receives search results from the SiteSearchController and displays them on a page. By default, the control's display looks like this.

NOTE: To manage the paging display at the bottom of the page, use an EktronUI:Pagercontrol.

Connecting a SiteSearchController to the SiteSearchResultsView control

Connecting a SiteSearchController to the SiteSearchResultsView Control

To enable search functionality, connect a SiteSearchController to a SiteSearchResultsView control. Use the control's controllerID property to do this. See Also: Understanding Search Server Controls

For the controllerID property value, enter the ID of the SiteSearchController that takes input from SiteSearchInputView control and returns search results to this control. For example:

<ektron:SiteSearchResultsView ID="SiteSearchResultsView1" 
    ControllerID="SiteSearchController1" runat="server">
</ektron:SiteSearchResultsView>

Customizing the SiteSearchResultsView control

Customizing the SiteSearchResultsView Control

To customize the SiteSearchResultsView Control, first add a set of <ItemTemplate> tags between the SiteSearchResultsView control's opening and closing tags (as explained in Modifying Templated Server Controls). Then, modify the search results in the following ways.

NOTE: As an alternative, you can copy the line that inserts a text box from siteroot\Workarea\FrameworkUI\Templates\Search\SiteSearchResultsView.ascx.

Displaying the search phrase with results

Displaying the Search Phrase with Results

Use <%# Eval("QueryText") %> to databind the search term to the SiteSearchResultsView control. This code sample below displays an example of this Search Phrase: followed by the search term.

<ektron:SiteSearchResultsView ID="SiteSearchInputView1" 
  ControllerID="SiteSearchController1" runat="server">
  <ItemTemplate>
	<p>Search Phrase:<%# Eval("QueryText") %> </p>
  </ItemTemplate>
</ektron:SiteSearchResultsView>

Displaying search results using a ListView control

Displaying Search Results Using a ListView Control

Use a ListView control to display search results from a SiteSearchController.

1. Within a ListView control, use an <%# Eval("Results") %> statement to databind search results to the ListView control.
   

   <asp:ListView ID="aspResults" runat="server" DataSource='<%# Eval("Results") %>'
   	ItemPlaceholderID="aspPlaceholder">

2. To define the main (root) layout of a ListView control, insert a LayoutTemplate. Within that template, insert a placeholder to store the server controls on the page.
   

   <asp:ListView ID="aspResults" runat="server" DataSource='<%# Eval("Results") %>'
   	ItemPlaceholderID="aspPlaceholder">
   <layouttemplate>
      <ul class="results"><asp:PlaceHolder ID="aspPlaceholder" 
         runat="server"></asp:PlaceHolder></ul></layouttemplate>

3. Use an ItemTemplate to specify the markup used to generate each record bound to the ListView. Here is an example that displays search results' title, summary, URL and date.
   

   <itemtemplate>
     <li>
        <h3><a href="<%# Eval("Url") %>"><%# Eval("Title") %></a></h3>
        <p><%# Eval("Summary") %></p>
        <p><%# Eval("Url") %> <%# Eval("Date") %></p>
     </li>
   </itemtemplate>

Here is the entire sample.



<itemtemplate>
<asp:ListView ID="aspResults" runat="server" DataSource='<%# Eval("Results") %>'
	ItemPlaceholderID="aspPlaceholder"> 
  <layouttemplate>
     <ul class="results">
    <asp:PlaceHolder ID="aspPlaceholder" runat="server"> </asp:PlaceHolder></ul>      
  </layouttemplate> 
  <itemtemplate>
    <li>
       <h3><a href="<%# Eval("Url") %>"><%# Eval("Title") %></a></h3>
       <p><%# Eval("Summary") %></p>
       <p><%# Eval("Url") %> <%# Eval("Date") %></p>
    </li> 
  </itemtemplate>
</asp:ListView>
</ItemTemplate>

Displaying search results using a GridView control

Displaying Search Results Using a GridView Control

You can use an asp:Gridview control to make search results look like the following.

—Image—

To modify the UI for SearchResultsView:

1. Within the <ektron:SearchResultsView> tags, insert <ItemTemplate></ItemTemplate>.
2. Between the <ItemTemplate> tags, insert the following code, shown in bold.
   

   <ektron:SearchResultsView ControllerID="SiteSearchController1" 
     runat="server">
      <ItemTemplate> <h2>Search results for: <%# Eval("QueryText") %></h2>
         <asp:Gridview ID="Gridview1" DataSource='<%# Eval("Results") %>' 
            runat="server">
         </asp:Gridview>
      </ItemTemplate>
   </ektron:SearchResultsView>

3. Modify the appearance of the results using Gridview properties and styles. See Also: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.aspx

SiteSearch Model Properties

You can use the properties with Eval statements to display aspects of content search results. For example, <%# Eval("Summary") %> displays the summary for content being returned by the search. See Also: Displaying Search Results, Data Fields Available to an Eval Statement

• AdvancedQueryText—Use with SiteSearchController. See Displaying Search Results Using a ListView Control.
• ElapsedTime—Use with SiteSearchResultsView, this is the time required to execute a search.
• ExactPhrase—Use with SiteSearchInputView, sets an EXACT ORDER relationship among search terms.
• Fields—Label, Name, Xpath: Retrieve information from XML Smart Forms. See XMLSearch Server Controls.
• PageInfo—Use with SiteSearchResultsView
  • Display information about search result numbers, such as Displaying results 11 through 20 of 35.
  • CurrentPageIndex—current page
  • EndCount—number of results found
  • NumberOfPages—number of results divided by results per page
  • PageCount—The number of the page being viewed currently
  • ResultCount—The number of the results returned for the search terms

    IMPORTANT: The result count is only an estimate. The count
    becomes more accurate you get closer to the final page.

  • ResultsPerPage— number of results displayed per page
  • StartCount—one
• QueryText—Use with SiteSearchInputView or SiteSearchResultsView, this is the string that the site visitor entered to begin search.
• Results—Use with SiteSearchResultsView, these are fields returned of type SearchResultsData. Display these inside a ListView or Repeater.
  • Date—last edit date
  • Summary—content summary, up to a maximum of 400 characters
  • Title
  • Url
  • Type: Content, forms, managed assets, and so on.
    For a full list, enter SiteSearchResultType into the Object Browser.
• SearchType—Use with SiteSearchResultsView
  • Advanced
  • Basic
  • None—no search yet
  • XmlSearch
• State—Use with SiteSearchResultsView
  • initialized— search has not been run yet
  • no results—no search results were returned
  • search results—search results were returned
• Suggested Results—Use with SiteSearchResultsView, these fields returned of type SearchResultsData for Suggested Results. Display inside a ListView or Repeater.
  • Summary—content summary, a maximum of 400 characters
  • Title
  • Url

    See Also: Displaying Suggested Results

• Suggested Spellings—Use with SiteSearchResultsView, displays a list of words that are similar to the entered search phrase. For a sample of using this, open siteroot\workarea\FrameworkUI\Templates
\Search\SiteSearchResultsView.ascx and find Eval("SuggestedSpellings").
• WithAllWords—Use with SiteSearchInputView, sets an AND relationship among search terms.
• WithAnyWord—Use with SiteSearchInputView, sets an OR relationship among search terms.
• WithoutWords—Use with SiteSearchInputView, sets a NOT relationship among search terms.
• XmlConfigId—Long Integer: If content is an XML Smart Form, the ID of its configuration. See Also: Adding a Smart Form

Inserting Search Server Controls

To provide search capabilities to your Web site content, insert all 3 controls onto an .aspx template. Because the search functions are managed by separate controls, you can place a search field and button in a one section of a page, and the results in another.

Also, unless you want to use the default paging properties (which show only 10 results), insert an EktronUI Pager control on the page to manage the paging of the search results.

Prerequisite: Search server controls were added to the Visual Studio Toolbox. See Adding Search Server Controls to Visual Studio.

If you drag and drop controls from the VS Toolbox, the necessary register statements are copied from the web.config file and added to the page.

<add tagPrefix="ektron" namespace="Ektron.Cms.Framework.UI.Controls" 
  assembly="Ektron.Cms.Framework.UI.Controls, Version=8.5.0.356, 
  Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />
<add tagPrefix="ektronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  assembly="Ektron.Cms.Framework.UI.Controls.EktronUI, 
  Version=8.5.0.356, Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />

If you copy and paste the sample code, add the following register statement for templated controls:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" 
namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

For Ektron UI controls, use this register statement:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %>

The tag prefix can be anything as long as it matches the control's prefix.

Here is a basic template showing the 3 controls.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TemplatedControl.aspx.cs" 
Inherits="TemplatedControl" ValidateRequest="false" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
  <body> 
    <form id="form1" runat="server">
     <div>
       <ektron:UserSearchInputView ID="UserSearchInputView1" ControllerID="SearchController1" runat="server">
       </ektron:UserSearchInputView>

       <ektron:UserSearchController ID="SearchController1" runat="server" />

       <ektron:UserSearchResultsView ControllerID="SearchController1" ID="UserSearchResultsView1" runat="server">
       </ektron:UserSearchResultsView>

	<ektronUI:Pager ID="pager1" runat="server" PageableControlID="SiteSearchController1" 
          ResultsPerPage="10"></ektronUI:Pager>
     </div>
    </form>  
  </body>
</html>	

UserSearchInputView Server Control

The UserSearchInputView server control lets site visitors search for Ektron users and members. See Also: Membership Users and Groups and Managing Users and User Groups

Site visitors can find users using any of these properties:

• first name
• last name
• username
• email address
• display name
• tag

Site visitors can use the wildcard character (*) to find all users that fit a certain pattern. For example, to find all users with any property that begins with adm, enter adm*.

The following image shows the default template's search options.

A site visitor's query string is collected by the UserSearchInputView server control and passed to the SearchController Server Control which, in turn, sends results to the UserSearchResultsView Server Control .

You can place the UserSearchInputView server control anywhere on a page—it does not need to be next to its results control. Also, you can place more than one UserSearchInputView control on a page.

Required Properties for UserSearchInputView control

Required Properties for UserSearchInputView Control

ControllerID—the ID of the SearchController that provides the data.

<ektron:Serena ID="UserSearchInputView1" ControllerID="SearchController1" runat="server">
</ektron:UserSearchInputView>

Customizing the UserSearchInputView control

Customizing the UserSearchInputView Control

This process is the same as Customizing the SiteSearchInputView Control. Refer to UserSearch Model Properties to learn which properties may be referenced.

UserSearchResultsView Server Control

The UserSearchResultsView server control displays the results of a user and member search. The control gets its results from a SearchController Server Control.

The following image shows the UserSearchInputView control's filters, as well as search results that use the UserSearchResultsView control's default template.

Connecting a SearchController to the UserSearchResultsView control

Connecting a SearchController to the UserSearchResultsView Control

To enable the display of user search results, use the UserSearchResultsView control's controllerID property to connect it to a SearchController. See Also: SearchController Server Control

For the controllerID property value, enter the ID of the UserSearchController that takes input from UserSearchInputView control and returns results to this control. For example:

<CMS:UserSearchResultsView ID="UserSearchView1" ControllerID="UserSearchController1" runat="server">
</CMS:UserSearchResultsView>
<CMS:UserSearchController ID="UserSearchController1" runat="server" />

Displaying search results

Displaying Search Results

To learn about displaying search results, see Displaying Search Results. To see an example of displaying user search results, see siteroot\workarea\FrameworkUI\Templates\Search\UserSearchResultsView.ascx.

UserSearch Model Properties

• Advanced QueryText—Use with SearchController Server Control, see Displaying Search Results Using a ListView Control.
• AvailableFilters—Label, Name, Value.
• DirectorySearchLetter—Use with UserSearchResultsView, this is the letter the site visitor clicks to initiate the search after clicking Browse Directory.
• DirectorySearchType—Use with UserSearchResultsView, this is First name, last name, or display name.
• PageInfo—Use with UserSearchResultsView, display information about search result numbers, such as Displaying results 11 through 20 of 35.
  • CurrentPageIndex—current page
  • EndCount—number of results found
  • NumberOfPages—number of results divided by results per page
  • PageCount—number of the page being viewed currently
  • ResultCount—number of the results returned for the search terms

    IMPORTANT: The result count is only an estimate. The count becomes more accurate you get closer to the final page.

  • ResultsPerPage— number of results displayed per page
  • StartCount—one
• QueryText—Use with UserSearchInputView or UserSearchResultsView, this is the string that the site visitor entered to begin search.
• Results—Use with UserSearchResultsView, these are the fields returned of UserSearchResults. Display these inside a ListView or Repeater, for example.
  • Avatar
  • DisplayName
  • email
  • FirstName
  • LastName
  • ProfileURL
  • Tags

    See Also: Modifying Templated Server Controls

• SearchType—Use with UserSearchInputView, this is Basic or Advanced search (site visitor clicks Browse Directory to access advanced search).
• State—Use with UserSearchResultsView, this is...
  • initialized— search has not been run yet
  • no results—no search results were returned
  • search results—search results were returned

Inserting Search Server Controls

To provide search capabilities to your Web site content, insert all 3 controls onto an .aspx template. Because the search functions are managed by separate controls, you can place a search field and button in a one section of a page, and the results in another.

Also, unless you want to use the default paging properties (which show only 10 results), insert an EktronUI Pager control on the page to manage the paging of the search results.

Prerequisite: Search server controls were added to the Visual Studio Toolbox. See Adding Search Server Controls to Visual Studio.

If you drag and drop controls from the VS Toolbox, the necessary register statements are copied from the web.config file and added to the page.

<add tagPrefix="ektron" namespace="Ektron.Cms.Framework.UI.Controls" 
  assembly="Ektron.Cms.Framework.UI.Controls, Version=8.5.0.356, 
  Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />
<add tagPrefix="ektronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  assembly="Ektron.Cms.Framework.UI.Controls.EktronUI, 
  Version=8.5.0.356, Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />

If you copy and paste the sample code, add the following register statement for templated controls:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" 
namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

For Ektron UI controls, use this register statement:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %>

The tag prefix can be anything as long as it matches the control's prefix.

Here is a basic template showing the 3 controls.

<%@ Page Language="C#" AutoEventWireup="true" 
  CodeFile="TemplatedControl.aspx.cs" 
  Inherits="TemplatedControl" ValidateRequest="false" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls"
  namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  tagprefix="ektronUI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
  <body> 
    <form id="form1" runat="server">
     <div>
       <ektron:ProductSearchInputView ID="ProductSearchInputView1" 
          ControllerID="ProductSearchController1" runat="server">
       </ektron:ProductSearchInputView>

       <ektron:ProductSearchController ID="ProductSearchController1" 
         runat="server" />

       <ektron:ProductSearchResultsView ControllerID="ProductSearchController1"
         ID="ProductSearchResultsView1" runat="server">
       </ektron:ProductSearchResultsView>
 
       <ektronUI:Pager ID="pager1" runat="server" 
         PageableControlID="ProductSearchController1" ResultsPerPage="10">
       </ektronUI:Pager>
     </div>
    </form>  
  </body>
</html>	

ProductSearchInputView Server Control

Use the ProductSearchInputView server control to search eCommerce Products. It provides a Basic and an Advanced search. The query string from the ProductSearchInputView control is passed to the ProductSearchController, which sends results to the ProductSearchResultsView.

You can place the ProductSearchInputView server control anywhere on a page, and it can be separated from the results display.

More than one ProductSearchInputView server control can reside on a page.

The following image shows the default template for this control.

Click the Advanced link to show these product search filters.

• With all words
• Without words
• Exact Phrase
• With any word

Required properties for ProductSearchInputView

Required Properties for ProductSearchInputView

ControllerID—the ID of the ProductSearchController that provides the data.

<CMS:ProductSearchInputView ID="ProductSearchView1" ControllerID="ProductSearchController1" runat="server">
</CMS:ProductSearchInputView>
<CMS:ProductSearchController ID="ProductSearchController1" runat="server" />

Customizing the ProductSearchInputView control

Customizing the ProductSearchInputView Control

This process is the same as Customizing the SiteSearchInputView Control. Refer to ProductSearch Model Properties to learn which properties may be referenced.

ProductSearchResultsView Server Control

Use the SearchResultsView server control to show search results sent from a ProductSearchController.

The ProductSearchResultsView is tied to the ProductSearchController by setting the property ControllerID.

The following image shows the ProductSearchView's search field and button and search results using the ProductSearchResultsView server control's default template.

Required properties for ProductSearchResultsView

Required Properties for ProductSearchResultsView

ControllerID—the ID of the UserSearchController that provides the data.

<CMS:ProductSearchResultsView ID="ProductSearchView1" ControllerID="ProductSearchController1" runat="server">
</CMS:ProductSearchResultsView>
<CMS:ProductSearchController ID="ProductSearchController1" runat="server" />

Modifying the default Product Search results view

Modifying the Default Product Search Results View

To learn about displaying search results, see Displaying Search Results. To see an example of displaying user search results, see [siteroot]\workarea\FrameworkUI\Templates\Search\ProductSearchResultsView.ascx.

ProductSearch Model Properties

This information is provided for each product returned with search results.

• AdvancedQueryText—Use with ProductSearchController, see Displaying Search Results Using a ListView Control.
• ExactPhrase—Use with ProductSearchInputView, this sets an EXACT ORDER relationship among search terms.
• PageInfo—Use with ProductSearchResultsView, this displays information about search result numbers, such as Displaying results 11 through 20 of 35.
  • CurrentPageIndex—current page
  • EndCount—number of results found
  • NumberOfPages—number of results divided by results per page
  • PageCount—number of the page being viewed currently
  • ResultCount—number of the results returned for the search terms

    IMPORTANT: The result count is only an estimate. The count becomes more accurate you get closer to the final page.

  • ResultsPerPage— number of results displayed per page
  • StartCount—one
• QueryText—Use with ProductSearchInputView or ProductSearchResultsView, this is the string used for searching.
• Results—Use with ProductSearchResultsView, these are the fields returned of ProductSearchResultsData. Display these inside a ListView or Repeater.
  • Catalog Number
  • ImageUrl
  • ListPrice
  • ProductID
  • SalePrice
  • SKU
  • Summary
  • Title
  • URL
• SearchType—Use with ProductSearchInputView or ProductSearchResultsView...
  • Advanced
  • Basic
  • None
  • XmlSearch
• State—Use with ProductSearchResultsView...
  • initialized— search has not been run yet
  • no results—no search results were returned
  • search results—search results were returned
• WithAllWords—Use with ProductSearchInputView, this sets an AND relationship among search terms.
• WithAnyWord—Use with ProductSearchInputView, this sets an OR relationship among search terms.
• WithoutWords—Use with ProductSearchInputView, this sets a NOT relationship among search terms.

Inserting search server controls

To provide search capabilities to your Web site content, insert all 3 controls onto an .aspx template. Because the search functions are managed by separate controls, you can place a search field and button in a one section of a page, and the results in another.

Also, unless you want to use the default paging properties (which show only 10 results), insert an EktronUI Pager control on the page to manage the paging of the search results.

Prerequisite: Search server controls were added to the Visual Studio Toolbox. See Adding Search Server Controls to Visual Studio.

If you drag and drop controls from the VS Toolbox, the necessary register statements are copied from the web.config file and added to the page.

<add tagPrefix="ektron" namespace="Ektron.Cms.Framework.UI.Controls" 
  assembly="Ektron.Cms.Framework.UI.Controls, Version=8.5.0.356, 
  Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />
<add tagPrefix="ektronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  assembly="Ektron.Cms.Framework.UI.Controls.EktronUI, 
  Version=8.5.0.356, Culture=neutral, PublicKeyToken=559a2c4fa21e63be" />

If you copy and paste the sample code, add the following register statement for templated controls:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" 
namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

For Ektron UI controls, use this register statement:

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %>

The tag prefix can be anything as long as it matches the control's prefix.

Here is a basic template showing the 3 controls.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TemplatedControl.aspx.cs" 
Inherits="TemplatedControl" ValidateRequest="false" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls" 
  namespace="Ektron.Cms.Framework.UI.Controls" tagprefix="ektron" %>

<%@ Register assembly="Ektron.Cms.Framework.UI.Controls.EktronUI" 
  namespace="Ektron.Cms.Framework.UI.Controls.EktronUI" tagprefix="ektronUI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
	<title></title>
</head>
  <body> 
    <form id="form1" runat="server">
     <div>
       <ektron:XmlSearchInputView ID="XmlSearchInputView1" 
         ControllerID="XmlSearchController1" XmlConfigId="9"   runat="server">
       </ektron:XmlSearchInputView>

       <ektron:XmlSearchController ID="XmlSearchController1" runat="server" />

       <ektron:XmlSearchResultsView ControllerID="XmlSearchController1" 
         ID="XmlSearchResultsView1" runat="server">
       </ektron:XmlSearchResultsView>
 
       <ektronUI:Pager ID="pager1" runat="server" 
         PageableControlID="XmlSearchController1" ResultsPerPage="10">
       </ektronUI:Pager>
     </div>
    </form>  
  </body>
</html>	

XmlSearchInputView Server Control

The XmlSearchInputView server control displays a Smart Form's fields and lets users search on them.

IMPORTANT: Only fields marked Indexed appear on the form. Also, you cannot search a Smart Form field if its entire xpath exceeds 64 characters. See Also: Specifying Which XML Elements are Indexed

Because XML fields have a type (for example, string, date, choice, integer, boolean), the template is dynamic and connected to a Smart Form’s data structure.

The Search Model for XML Smart Forms

The SearchModel gets bound to (that is, determines) the view. When viewing the SearchModel in the object browser, you see a property named Fields, which is a list of each XML Smart Form field.

To view the SearchModel for XML Smart Forms, insert XMLField into the Object Browser. The class consists of a...

• Label—friendly name
• Name—internal smart form name
• Xpath—path to field in Smart Form

XML Smart Form search controls use these fields to retrieve and display Smart Form content.

As explained in Using Data Field Types, there are many types of Smart Form fields. Each type has a subclass, which has a corresponding user control, an .ascx template file. User controls are located in C:\Program Files(x86)\Ektron\CMS400vversion\workarea\FrameworkUI\Templates\Search\Fields. As explained in Modifying the Default Markup, to change a control's default markup, modify its template.

Smart Form field controls receive an XML field and cast it into the specified field type. For example, the Object Browser shows that the ChoiceField template (ChoiceField.ascx) contains a...

• List of possible choices
• Selected value—the current selection
• SelectionMode—select one or many?
  

  

The ChoiceField template receives an XML field and casts it into a choice field.

Creating your own XML Search Template

Prerequisite: An understanding of the structure of XML field types, as explained in The Search Model for XML Smart Forms .

1. Bind fields to a list view.
   

   <ektron:XmlSearchInputView ID=”xmlSearchView” runat=”server” ControllerID=”SearchController” XMLConfigId=”10”>
       <ItemTemplate>
       <asp:ListView ID=”fields” DataSource=’<%# Eval(“Fields”) %>’ runat=”server”>

   NOTE: The DataSource is the field's array returned from the SearchModel.

2. Insert a set of <ItemTemplate> tags. 
   

   <ektron:XmlSearchInputView ID=”xmlSearchView” runat=”server” 
     ControllerID=”SearchController” XMLConfigId=”10”>
        <ItemTemplate>
         <asp:ListView ID=”fields” DataSource=’<%# Eval(“Fields”) %>’ 
           runat=”server”>
        </ItemTemplate>

3. Get an XML field and display its corresponding template. Because it does not specify which type of XML Smart Form field is being retrieved, use an XMLSearchField control to determine that.

   The XMLSearchField control has a Field property, which maps the control to the correct template in the \workarea\FrameworkUI\Templates\Search\Fields folder. For example, a boolean Smart Form field is mapped to booleanfield.ascx.

   

   <ektron:XmlSearchInputView ID=”xmlSearchView” runat=”server” 
     ControllerID=”SearchController” XMLConfigId=”10”>
           <ItemTemplate>
              <asp:ListView ID=”fields” DataSource=’<%# Eval(“Fields”) %>’ 
                runat=”server”>
           </ItemTemplate>
           <ItemTemplate>
              <ektron:XmlSearchField ID="uxField" runat="server" 
                Field='<%# Container.DataItem %>'>
              </ektron:XmlSearchField>
           </ItemTemplate>

   The XMLSearchField control lets you manage the display of XML Smart Form fields displayed in the ListView. So, you can modify the search input form with effects like the <ItemSeparatorTemplate>, which lets you place text, images, and so on, between each field.

Customizing the Rendering of a Field

You can customize the behavior of an XML Smart Form field on the input form.

This is a complex procedure because, when a user clicks Search, your template must retrieve the modified fields, pass that data to the containing template which, in turn, passes the modified fields to the Search API. Use 2-way data binding to perform this procedure.

Prerequisite: You followed the steps in Creating your own XML Search Template.

1. Inside your XML Smart Form template, press <Enter> after Field='<%# Container.DataItem %>'>.
2. Insert a less than symbol (<). A drop-down list of Smart Form field types appears.
   

   

3. To replace the value of any field type, insert the corresponding Template field. For example, to replace a text element, click TextTemplate to insert a set of <TextTemplate> tags. Whatever you enter between the tags replaces the text template on the Smart Form input form.

   For example, to replace a text template field with a text box, use the following syntax.

   <TextTemplate><asp:TextBox ID="aspValue" Text='<%# Bind("Value") %>' 
   runat="server" </asp:TextBox></TextTemplate>

Notice that this example uses Bind, which is a two-way statement. If the user changes the value in the text box, then posts back, the Bind command pushes the data into the template. The child template then takes the modified data from the template and pushes it back to the data object.

Injecting your Own Service

Ektron's templated server controls use an MVC architecture, which is a common design pattern for user interfaces. MVC consists of a

• Model, which stores the state and accesses the application code used by the control; resides in the service layer
• View, which renders the data
• Controller, which maps action inputs to the model and elements view; also performs the business logic of the UI

Because MVC architecture separates the display layer from the data layer, a designer can work on the styling of the search results page, while a developer focuses on data being rendered.

Creating a custom service

Creating a Custom Service

You can extend the functionality of templated server controls by creating a custom service. For example, you can dynamically replace the content of the search results. You might want to do this to create a profanity filter, or to implement a "blacklist" of replacement terms in search results.

The following image illustrates the location of a custom (passthru) service within MVC architecture.

.

The passthru service completes these steps.

1. Takes user input from View and Controller Layers.
2. Modifies it.
3. Sends modified data to Model Layer.
4. On the way back, can modify results again.
5. Send results to Controller.
6. Controller pushes results to the View Layer.

Procedure for creating a custom service

Procedure for Creating a Custom Service

Use the siteroot/unity.ui.services.config file to map each search type to a service. Below is the section of the file that accomplishes the mapping. By default, Ektron search controls use ISearch.Service to take in and return data.

Note separate register statements for regular searches, product searches, and user searches.

NOTE: The ISearchController service handles regular content and XML Smart Form searches.

<register type="Ektron.Cms.Framework.UI.ISearchController, Ektron.Cms.Framework.UI"
mapTo="Ektron.Cms.Framework.UI.Services.SearchController, Ektron.Cms.Framework.UI.Services"/>
<register type="Ektron.Cms.Framework.UI.IProductSearchController, Ektron.Cms.Framework.UI"
mapTo="Ektron.Cms.Framework.UI.Services.ProductSearchController, Ektron.Cms.Framework.UI.Services"/>
<register type="Ektron.Cms.Framework.UI.IUserSearchController, Ektron.Cms.Framework.UI"
mapTo="Ektron.Cms.Framework.UI.Services.UserSearchController, Ektron.Cms.Framework.UI.Services"/>		

Follow these steps to create your own service and map it to a search type.

1. In Visual Studio, open siteroot/unity.ui.services.config.
2. Update the service registration with a new service name. This example assigns to ISearchService a service named DemoSearchService.
   —Code—

   <register type="Ektron.Cms.Framework.UI.ISearchService, Ektron.Cms.Framework.UI"
   mapTo="Demo.DemoSearchService"/>           		

3. In Solution Explorer, right click the AppCode folder and select Add New Item.
   

   

4. Select C# Class and give your new service a name.
   

   

5. Within the .cs file, insert this statement: using Ektron.Cms.Framework.UI;
6. Assign the name of the service that you are overriding. (Service names are listed in unity.ui.services.config.)
   

   public class demosearchservice: ISearchService
   {
   }         		

7. Right click the mouse and select Implement Interface > Implement Interface.
   

   

8. Several statements like the one below are inserted. They provide inputs to the search service.
   

   public void  AdvancedSearch(SearchModel model)
   {
   throw new NotImplementedException();
   }         		

9. To create a passthru service, first instantiate the old mock search service. See Also: Creating your own XML Search Template
   

   public class demosearchservice : ISearchService
   ISearchService searchService;
   public DemoSearchService()
   {
   this.searchService= new MockSearchService();
   }        		

10. Inside the Advanced, Basic, GetXmlSearchFieldList and XmlSearch methods, call the old service and pass in the same data. For example
    

    public void  BasicSearch(SearchModel model)
    {
    this.searchService.BasicSearch(model);
    }         		

    Now, when you drop inputview and resultsview controls on a page...

    • it instantiates the controller.
    • it ties the input and results view controls to the controller.
    • it instantiates the service, which ties the controller to the service.

Controlling search results with a custom service

Controlling Search Results with a Custom Service

Example 1: Any search returns “fifteen” for a result

Example 1: Any search returns “fifteen” for a result

1. Open the site search template page.
2. Within SiteSearchResultsView tags, insert a set of <itemtemplate> tags.
3. Within the <itemtemplate> tags, insert <%# Eval(“QueryText”) %>

   <ektron:SiteSearchResultsView ID="SiteSearchResultsView1" 
     ControllerID="Scontroller" runat="server">
   	<ItemTemplate>
   		<%# Eval(“QueryText”) %>
   	</ItemTemplate>
   </ektron:SiteSearchResultsView	\>		

4. Within the new.cs file that you created in Procedure for Creating a Custom Service, modify the value of QueryText. For this example, change the query text to "fifteen." To do this, edit the .cs file, like this.

   ‘Public void BasicSearch(SearchModel model)
   {
   model.Querytext = “fifteen”;	
   }
   

Example 2: Replace “Summary” with “Ektron” in all results

Example 2: Replace “Summary” with “Ektron” in all Results

This example shows how search results may be modified after they are retrieved (that is, on the way back). To do this, edit the .cs file that you created in Procedure for Creating a Custom Service like this.

Public void BasicSearch(SearchModel model)
{
  model.Results.ForEach(result => 
   { result.Summary = result.Summary.Replace(“Summary”, “Ektron”); });
} 	

The above code loops through all results (Results.ForEach) and replaces "Summary" with "Ektron" in each one.

Example 3: Remove first result

Example 3: Remove First Result

This example shows how to remove the first search result that is retrieved. To do this, edit the .cs file that you created in Procedure for Creating a Custom Service like this.

Public void BasicSearch(SearchModel model)
{
model.Results.RemoveAt(0); 
}	

Using the Advanced Query Text Parameter

The AdvancedQueryText parameter lets you customize the behavior of the search controller. As examples, you can restrict search results to

• content properties, such as
  • content in a folder, or a folder and all of its child folders
  • Spanish-language content
• user properties, such as
  • those with tags set to "Race Car Fans"
  • those whose email address includes "widgets.com"
• eCommerce product properties, such as
  • catalog number is between 1 and 10,000
  • sale price is less than $50 US

Here is a sample AdvancedQueryText statement that restricts search results by language and folder.

<Ektron:SiteSearchController ID=”SiteSearchController1” 
  AdvancedQueryText=”(contentlanguage:1033 AND folderid:10)”

The value assigned to AdvancedQueryText is appended to the user’s input.

Retrieving folder vs. folderpath

Retrieving Folder vs. FolderPath

• To reference a folder by id number, use folderid:10
• To reference a folder and all of its children, use folderidpath:'10'
• To exclude a folder but include all of its child folders, use (folderidpath:'10' AND NOT folderid:10)

  NOTE: You cannot use the root folder as part of the foldernamepath.

Obtaining a list of managed properties

Obtaining a List of Managed Properties

You can get a list of Ektron's managed properties from the API. To access this, open the code-behind file of a page that uses a templated control, such as SiteSearch.aspx.cs, and type SearchContentProperty. Intellisense displays all site search content properties.

NOTE: You can also see a list of Ektron's managed properties in ReturnProperties .

In addition, you can use this method to get a list of properties for...

• Users—SearchUserProperty
• eCommerce catalog entries—SearcheCommerceProperty
• Smart Form fields—SearchSmartFormProperty

Allowed operators in the AdvancedQueryText parameter

Allowed Operators in the AdvancedQueryText Parameter

• equals (=)
• greater than (>)
• less than (<)
• contains (:)