Export (0) Print
Expand All

How to: Use the RealTimeSearchMonitor Extender

Retired Content

This content is outdated and is no longer being maintained. It is provided as a courtesy for individuals who are still using these technologies.
This page may contain URLs that were valid when originally published, but now link to sites or pages that no longer exist.

This topic describes how to use the RealTimeSearchMonitor control. This control allows ASP.NET developers to implement real-time search without writing custom client-side code. For more information about this control, see RealTimeSearchMonitor Control.

Prerequisites

To use the RealTimeSearchMonitor, you must have a Web site or Web application project that meets the following conditions:

  • It has been configured to target the Microsoft .NET Framework 3.5.

The Web page that you want to add real-time search capabilities to must have at least one search input control and must contain an UpdatePanel control where the search results are displayed.

Steps

The following procedure describes how to use the RealTimeSearchMonitor control to add real-time search capabilities to a search form.

To use the control

  1. In your Web site, add a reference to the RealTimeSearch.dll assembly.
  2. Add the RealTimeSearchMonitor control to the Toolbox (this step is necessary only if you do not see the RealTimeSearchMonitor control in the Toolbox). To add the RealTimeSearchMonitor control to the Toolbox, right-click the Toolbox, and then click Choose Items. On the .NET Framework Components tab, click Browse, select the RealTimeSearch.dll assembly, and then click Open. In the list of components, select the RealTimeSearchMonitor control, and then click OK.
  3. Drag a RealTimeSearchMonitor control to the Web page to which you want to add real-time search capabilities.
  4. Open the Properties window for the control, as shown in Figure 1.

    Ff709866.84d60846-9bce-437e-bb9d-d9c1e30a4305(en-us,PandP.10).png

    Figure 31

    Properties window for the RealTimeSearchMonitor control
  5. Enter the ID of the UpdatePanel control where the search results are displayed in the AssociatedUpdatePanelID property.
  6. Click the ellipsis in the ControlsToMonitor property to open the collection editor, as shown in Figure 2.

    Ff709866.41f74425-72aa-45cb-86c7-4a8d5a42b85f(en-us,PandP.10).png

    Figure 32

    Collection editor for the ControlsToMonitor property
  7. For each input control that you want to be monitored, click Add and set the following properties:
    • TargetId. This is the ID of the input control to be monitored
    • (Optional) EventName. This is the name of the event of the input control that triggers an update in the associated UpdatePanel control. If no value is specified for this property, the default event of the control will trigger the update.
      Ff709866.note(en-us,PandP.10).gifNote:
      Note: The RealTimeSearchMonitor control adds an AsyncPostBackTrigger to the associated UpdatePanel control at run time for each monitored control. The EventName property of the AsyncPostBackTrigger is set with the value you enter in the EventName property of the control to monitor.

  8. Click OK to close the collection editor.
  9. Set the Interval property. The Interval property defines how often (in milliseconds) the input control is checked to see if the value has changed.

    The following code extracted from the Real-Time Search QuickStart shows the markup of a fully configured RealTimeSearchMonitor control.

    <rts:RealTimeSearchMonitor ID="CustomerRealTimeSearchMonitor" runat="server" Interval="700" AssociatedUpdatePanelID="ResultsUpdatePanel">
        <ControlsToMonitor>
            <rts:ControlMonitorParameter TargetId="CompanyNameTextBox" />
            <rts:ControlMonitorParameter TargetId="CityTextBox" />
            <rts:ControlMonitorParameter TargetId="StateDropDown" />
            <rts:ControlMonitorParameter TargetId="ZipCodeTextBox" />
        </ControlsToMonitor>
    </rts:RealTimeSearchMonitor>
    
  10. Add event handlers for the input controls’ events that you want to monitor, and implement them in the code-behind file of your Web page. In the event handlers, you should execute the search query and display the result set inside the associated UpdatePanel control.
    Ff709866.note(en-us,PandP.10).gifNote:
    Note: Typically, you subscribe to the TextChanged event of TextBox controls.

Ff709866.note(en-us,PandP.10).gifNote:
Note: The RealTimeSearchMonitor control invokes the validators of the monitored controls before performing an asynchronous postback. If the validation fails for any of the input controls, the postback is not done.

Show:
© 2014 Microsoft