2

我正在使用 jquery-ui 自动完成功能我没有得到我需要的东西。我有自动完成工作，但现在这是它的行为。

  1. 用户开始输入并给出建议
  2. 用户找到需要的建议并按 Enter 将建议放入文本框中
  3. 用户按“输入”提交表单

我想结合 #2 和 #3 中发生的事情，以便用户做出选择，按“输入”，然后提交表单。

我发现了一些类似问题的帖子，但我无法找到适合我的解决方案。我认为这应该工作......但它没有。

HTML

    <form accept-charset="UTF-8" action="/contacts" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div>
        <input id="search" name="search" size="30" type="text" />
        <input class="button medium blue1" type="submit" value="Search" />

Javascript

  $(document).ready(function() {
      $("#search").autocomplete({
        source: "/search_suggestions",
        autoFocus: true,
        select: function(event, ui) {
                        $(event.target).val(ui.item.value);
                        $('#search').submit();
                        return false;
                    }
        });
      });

我究竟做错了什么？

更新：谢谢大家的快速回复！

4

4 回答 4

4

您正在尝试在文本框而不是表单上运行搜索！

$('#search').closest("form").submit();

或在表单中添加一个 id 并替换

$('#searchFormsIdHere').submit();
于 2013-03-19T14:56:16.057 回答
2

您必须正确指定表单 ID：

<form accept-charset="UTF-8" action="/contacts" method="get" id="searchform">
  ...
</form>

$(document).ready(function() {
  $("#search").autocomplete({
    source: "/search_suggestions",
    autoFocus: true,
    select: function(event, ui) {
                    $(event.target).val(ui.item.value);
                    $('#searchform').submit();
                    return false;
                }
    });
  });
于 2013-03-19T14:56:51.100 回答
1

将表单的 id 设置为searchFormsIdHere

$(document).ready(function() {
      $("#search").autocomplete({
        source: "/search_suggestions",
        autoFocus: true,
         select: function (event, ui) {
     var selectedObj = ui.item;              
      $("#search").val(selectedObj.value);
     $('#searchFormsIdHere').submit();
        });
      });
于 2013-03-19T14:57:33.557 回答
1

我认为你可以更换

$('#search').submit();

和

$('#search').parents('form').submit();
于 2013-03-19T14:57:56.907 回答