如何像google的autosuggest一样使用jqueryui提交表单？

看起来在jqueryui中使用类别使事情变得有点复杂。我试过这个：

<script type="text/javascript">
$(document).ready(function() {
    $.widget( "custom.catcomplete", $.ui.autocomplete, {
        _renderMenu: function( ul, items ) {
            var self = this,
                currentCategory = "";
            $.each( items, function( index, item ) {
                if ( item.category != currentCategory ) {
                    ul.append( "<li class='ui-autocomplete-category'>" + item.category + "</li>" );
                    currentCategory = item.category;
                }
                self._renderItem( ul, item );
            });
        },

      select: function(event, ui) { 
        $("input#autocomplete_text").val(ui.item.value);
        $("#autocomplete_form").submit();
      }
    });
    $( "#autocomplete_text" ).catcomplete({
        delay: 0,
        source: function(request, response) {
                $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
                data: { term: $("#autocomplete_text").val()},
                dataType: "json",
                type: "POST",
                success: function(data){
                    response(data);
                }
            });
        }
    });
});
</script>

使用该表格：

                    <form id="autocomplete_form" name="input" action="autocomplete/redirect" method="post">
                        <input size="38" type="text" id="autocomplete_text" name="autocomplete_text" value="İlan kodu, kategori, ilan veya emlakçı ara" />
                        <input type="hidden" id="data" name="data" value="0" />
                        <input class="submit-button" type="submit" value=" EMLAK ARA " />
                    </form> 

我的

我想做的是，在点击建议列表中的一个项目后提交表单

---

任何帮助都将不胜感激。提前谢谢

我建议您首先检查php文件。。您将获得未定义的变量：link。。这意味着$link变量未设置，或者ajax中的数组未通过。

从ui.autocomplete init函数中删除select:函数，并将其移动到catcomplete函数

嵌入式PHP和依赖于您的服务器对类别的响应使得在您的web域之外为我们进行编辑成为一件麻烦事

工作示例少了ajax的东西

<script type="text/javascript">
$(document).ready(function() {
$.widget( "custom.catcomplete", $.ui.autocomplete, {
    _renderMenu: function( ul, items ) {
        var self = this,
            currentCategory = "";
        $.each( items, function( index, item ) {
            if ( item.category != currentCategory ) {
                ul.append( "<li class='ui-autocomplete-category'>" + item.category +   "</li>" );
                currentCategory = item.category;
            }
            self._renderItem( ul, item );
        });
    }
});
$( "#autocomplete_text" ).catcomplete({
    delay: 0,
    select: function(event, ui) { 
    $("#autocomplete_form").submit();
  },
    source: function(request, response) {
            $.ajax({ url: "<?php echo site_url('autocomplete/suggestions'); ?>",
            data: { term: $("#autocomplete_text").val()},
            dataType: "json",
            type: "POST",
            success: function(data){
                response(data);
            }
        });
    }
});
});
</script>

---

你的例子对我很有用，只是因为它是一个PHP错误，所以不能发布。你到底需要什么帮助？@dannix你读过奎斯蒂诺的书名吗？我想做的是，在单击“建议”列表中的某个项目后提交表单。我做了是的，但不明白您在选择建议后是否要提交。@dannix我已更新问题以澄清。对不起，没问题：-我已经发布了我的答案。无法解释为什么你的方法不起作用。我已经更新了我的问题。提交表单不是问题，问题是选择项目后提交按钮。像onselect一样，我看到的唯一解决方案是创建一个click事件并设置一个值。为此，我建议您使用一个。然后说$.clickfunction{var item=$this.html；}；之后，单击submit按钮时，只需发送var项作为搜索词。