How to: Highlight the Text Placed Inside the DataItem Template During Searching

  • 3 min to read

By default, search results contained in templates are not highlighted. This example illustrates how to highlight them manually. The main idea is that it is necessary to wrap the found text in a span tag with the "dxcvHL" class. Note: This is a basic example that illustrates how to process simple requests. If you create a composite criterion, it is necessary to perform additional operations to parse the search text.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text.RegularExpressions;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DevExpress.Web;

public partial class _Default : System.Web.UI.Page
    protected void label1_DataBound(object sender, EventArgs e)
        ASPxLabel label = sender as ASPxLabel;
        label.Text = HighlightSearchText(label.Text, ASPxCardView1.SearchPanelFilter);

    public static string HighlightSearchText(string source, string searchText)
        if (string.IsNullOrWhiteSpace(searchText))
            return source;
        var regex = new Regex(Regex.Escape(searchText), RegexOptions.IgnoreCase);
        if (regex.IsMatch(source))
            return string.Format("<span>{0}</span>", regex.Replace(source, "<span class='dxcvHL'>$0</span>"));
        return source;