选择自动完成建议时如何提交表单

Question

我正在使用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;
                    }
        });
      });

我究竟做错了什么？

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

Answer 1

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

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

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

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

Answer 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;
                }
    });
  });

Answer 3

将表单的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();
        });
      });

Answer 4

我想你可以替换

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

同

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