如何使用 .NET 获取嵌套在 jQuery Typeahead Search <div> 中的 asp:TextBox 元素的值

Question

我有以下标记

<div class="typeahead__container">
  <div class="typeahead__field">
    <span class="typeahead__query">
            <asp:TextBox runat="server" ID="searchInputField" CssClass="js-typeahead" name="q" type="search"></asp:TextBox>
        </span>
    <span class="typeahead__button">
            <button type="submit">
                <span class="typeahead__search-icon"></span>
    </button>
    </span>
  </div>
</div>

通常，使用代码隐藏我们可以得到 <asp:TextBox> 元素的文本值，如下所示：

Dim val As String = searchInputField.Text

就我而言，这不起作用。

以上代码是以下demo的例子Hockey v2的一部分 http://www.runningcoder.org/jquerytypeahead/demo/

我假设我无法获取文本值，因为结果不是文本框中的纯文本（参见下图）

下图描述了文本值在 HTML 中的呈现方式。这些值存储在 <span> 元素中，因此 <asp:TextBox> 不知道这些值。

关于如何使用隐藏代码（或使用任何其他一般方法）获取文本值（Canadiens 和 Avalance）的任何建议？

更新 - 已解决

感谢 @Andrew 的建议，我设法使用 <asp:HiddenField> 元素使用 Typehead 的 onSubmit 回调将值传递到后端。

callback: {
        onSubmit: function (node, form, items, event) {
         event.preventDefault();
         var searchValue = items.map(a => a.ID)
         document.getElementById("hiddenSearchResults").value = searchValue ;
         setTimeout(function () { __doPostBack(document.forms[0].name ); }, 1)
}

然后在后面的代码中我得到了这样的值：

searchValues = hiddenSearchResults.Value

Answer 1

默认情况下，输入元素的呈现 Id 不会是 "searchInputField" - 请在浏览器中查看页面源代码。

但是，您可以将 ClientIdMode="Static" 添加到控件的属性中以使其成为：

<asp:TextBox runat="server" ID="searchInputField" ClientIdMode="Static" CssClass="js-typeahead" name="q" type="search"></asp:TextBox>

然后jQuery就能找到它了。

然后要在代码隐藏中获取数据，我建议添加一个 asp:hidden 控件并将其填充到按钮的 JavaScript onclick 事件中。隐藏控件的值将在服务器端可用。

如何使用 .NET 获取嵌套在 jQuery Typeahead Search <div> 中的 asp:TextBox 元素的值

How to get the value of an asp:TextBox element nested in a jQuery Typeahead Search <div> using .NET

vb.net

jquery

typeahead

typeahead.js

更新 - 已解决