JQuery自动完成后获取ID的值答案

【问题标题】：Get Value of ID after JQuery AutocompleteJQuery自动完成后获取ID的值
【发布时间】：2019-02-27 21:58:40
【问题描述】：

我有两个使用自动完成功能的 TextBoxFor 字段。在它们被选定的自动完成值或手动值填充后，其他 JavaScript 函数在引用 ID.val() 时为空白。需要添加/更改什么来获得这些值？提前致谢！

编辑： 在发送到视图之前预填充控制器中的字段允许函数调用检索正确的预填充值。似乎只有当用户尝试编辑字段和/或使用自动完成时，字段值才会被识别。

EDIT2：我尝试将函数绑定到 document.ready，然后是 on click 和 document.on click，但都没有在文本框 ID 中找到值。

剃须刀：

<div class="row">
    <div class="col-lg-12">
        @Html.LabelFor(m => m.AddedWorkmate, "Workmate To Add", new { @class = "control-label" })
        @Html.TextBoxFor(m => m.AddedWorkmate, new { data_autocomplete_url = Url.Action("GetWorkmates"), @class = "form-control" })
    </div>
</div>
<div class="row">
    <div class="col-lg-4">
        <button type="button" id="bUser" name="bUserButton" class="btn btn-primary btn-sm">Add Workmate Recipient</button>
    </div>
</div>

脚本：

function ExampleFunction() {
    var $addedW = $("#AddedWorkmate");//This should work, but apparently doesn't
    var textTest = $addedW.text(),// = ""
        valueTest = $addedW.val();// = ""
    //Stuff to do
}

【问题讨论】：

标签： javascript jquery asp.net asp.net-mvc razor

【解决方案1】：

我认为如果您输入自动完成功能并且您仍然拥有焦点，输入将不会检测到更改。您是否尝试过转义文本框并随后致电ExampleFunction？

您还可以在此文本框的input 事件上绑定ExampleFunction。input 在用户输入或粘贴时触发，因此它也应该与自动完成一起使用。

(function(){
      $('#AddedWorkmate').on("input", ExampleFunction);
   }
)();

function ExampleFunction() {
    var text = $(this).val();
}

编辑：

尝试以下步骤：

离开自动补全。在m => m.AddedWorkmate 文本框中键入或粘贴一些文本，例如test.
打开控制台。
输入并致电$("#AddedWorkmate).val()。
您应该会收到"test" 的回复。
如果你有这个 - 你在 DOM 中没有错误。
然后尝试像这样在input上绑定一个事件

(function(){
      $('#AddedWorkmate').on("input", function(){console.log('test')});
   }
)();

如果这会在输入时登录到控制台 - 是的，您有正确的绑定。
然后专注于获取价值。此时它必须在$(this).val() 内部，我看不到任何其他可能性。如果它不是未定义的并且值仍然为空，那么您在问题范围之外做错了。
如果您成功获取该值，则将其与自动完成一起加入 - 它应该可以工作。

【讨论】：

感谢您的回答！在按下触发该功能的按钮之前，我尝试在文本框外部单击，并且该值仍然是“”。我将尝试将函数绑定到文本框的输入。
我尝试将示例代码放入，但输入代码没有被触发。 ExampleFunction 只有在按钮被按下时才会被触发。
你确定这个 TextBoxFor 的 id 呈现给 AddedWorkmate 吗？请验证您是否可以将 $('#AddedWorkmate').val() 用于手动输入的文本。我没有完整的上下文，所以我可能会错过某事。
这似乎是实际的 ID。查看源代码，它是 id = "AddedWorkmate"。我认为这与您最初提出的关于自动完成的重点的内容类似，但我不确定。
那我不知道。我认为您在此范围之外的某个地方有一个我无法分辨的错误。此时，您应该能够调用 $('#AddedWorkmate').val() 并在单击按钮之前获取您输入的任何内容。尝试验证您没有任何其他具有相同 id 的元素，并且输入事件绑定被正确调用。

【解决方案2】：

将您想要的 id 添加到文本框，以便您可以从 jQuery 中引用它。

@Html.TextBoxFor(m => m.AddedWorkmate, new { data_autocomplete_url = Url.Action("GetWorkmates"), @class = "form-control", id="AddedWorkmate" })

【讨论】：

感谢您的建议，但这似乎不起作用。就像示例一样添加了 id，并且 .val() 仍然读取“”。

【解决方案3】：

所有这一切背后都有一个草率的错误：该字段在网页的早些时候被声明为@HiddenFor。在看到输入在源代码中“隐藏”后，该行被删除，一切正常。

【讨论】：