智能搜索文本框

• 下载 GeneralizedSmartSearch.zip - 47.6 KB

引言

该项目是 CodeProject 上 Type-Ahead 建议框文章的更新版本(https://codeproject.org.cn/Ajax/typeahead.asp)。该项目存在很多局限性，我试图通过这个更新版本克服这些局限性。此代码已通用化，并公开了许多属性和方法。现在，您必须在 UI 层中填充智能搜索所需的数据，或者更改智能搜索代码，该代码将负责获取数据并呈现数据。智能搜索代码非常依赖于“SmartLookup.xml" 文件。为了使智能搜索能够工作，应该维护该文件的格式。列名区分大小写，应该与数据集中的列名完全匹配。

您可以使用智能搜索显示带分隔符或在单个列上的键值对。

背景

其概念与 TypeAhead 建议框相同，我创建了一个自定义服务器控件，该控件由一个 TextBox 和一个 div 对象组成。“keyUp”文本框的事件触发对服务器的请求，并期望服务器从表中获取前 10 条记录（从表中选择字段类似“keyword%”的前 10 个字段），以 XML 形式发送到浏览器。

在客户端（即 Web 浏览器）中，我使用了三个 AJAXSLT 函数：“xmlParse()”、“xsltProcess()”和“el”。“el()”只是“document.getElementById()”的快捷方式。然而，“xmlParse”和“xsltProcess”旨在解析 XML、XSLT 并将其转换为 HTML。

HTML 输出将被注入到 div 对象中，该对象是用于记录选择的下拉区域。

我对代码做了一些更改，现在用户可以覆盖 Textchange 事件并在智能搜索文本更改时编写适当的代码。如果您将结果显示为 ID-Value 对，则可以将其视为下拉列表，公开了 3 个属性以获取 SelectedID、SelectedText 和 SelectedValue (ID - Value)。

使用代码

如果绑定列的数据类型是数值类型，则在 XML 中，列名应该附加字符“s”。SmartSearch 类将负责在该表上创建此列。

 <Employee>



    <lookupName>Employee Search</lookupName>

    <SearchColumns>

      <SearchColumn active="true">

        <dataField>sEmployeeID</dataField>

        <heading>Employee #</heading>

        <dataType>int</dataType>

        <compareOperator>=</compareOperator>

      </SearchColumn>

      <SearchColumn active="true">

        <dataField>EmployeeName</dataField>

        <heading>Employee Name</heading>

        <dataType>string</dataType>

        <compareOperator>=</compareOperator>

      </SearchColumn>

    </SearchColumns>

    <columns>

      <column>

        <dataField>SmartIDName</dataField>

        <ExpressionString1>sEmployeeID</ExpressionString1>

        <ExpressionStringSeperator>' - '</ExpressionStringSeperator>

        <ExpressionString2>EmployeeName</ExpressionString2>

        <ConvertColumnToString> </ConvertColumnToString>

      </column>

    </columns>

  </Employee>

dataType 元素可以具有以下三个枚举值中的任何一个。

public enum ColumnDataType

{

INT,

STRING,

DATETIME,

}

smartsearch 的 DatatoBind 属性应该填充包含需要显示给用户的值的数据集。这应该在 smartsearch 使用的页面的 Page_Load 事件中填充。

XMLLookupType 属性应该指定需要选择哪个 xml 元素来显示数据。在上面的示例中，它将是“Employee”

DefaultID 属性应该等于用于在 JavaScript 中标识控件的控件的 ID 属性

关注点

我想尽量减少对数据库的访问次数，因此从数据库获取的值存储在会话变量中，并且被反复使用，因为我的数据是静态的。我希望限制显示的记录数量（发送回 js 回调函数），而无需在 select 查询中应用 top 关键字，以下 url http://forums.devx.com/showthread.php?t=153787 帮助我从数据集中获取前几条记录。