将相同的功能自动完成应用于多个输入框javascript

时间:2014-04-30 14:37:57

标签: javascript jquery jquery-ui jquery-autocomplete

我有一个自动完成的javascript函数,我不知道如何在同一页面上使用多个输入框。我已经尝试了很多东西,由于某种原因它打破了脚本这里是代码以及我现在是怎么做的..

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript">
    $(document).ready(function() {
        SearchText();
    });
  function SearchText() {
        $(".autosuggest").autocomplete({

             select:function(event, ui){
              window.location.href = '/Products/ProductInfoCenter.aspx?partnum=' + ui.item.value;
           },
            source: function (request, response, ui) {
                $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "/test.aspx/GetAutoCompleteData",
                    data: "{'PartNumber':'" + document.getElementById('txtPartNum').value + "'}",
                    dataType: "json",
                    success: function (data) {
                       response(data.d);
                    },
                    error: function (result) {
                        alert(err.message);
                    }
                });
            }
        });
    }

</script>

输入框......

   <input type="text" id="txtPartNum" class="autosuggest" />
   <input type="text" id="txtPartNum" class="autosuggest" />

当然这不起作用..

谢谢你,请帮忙

2 个答案:

答案 0 :(得分:0)

我认为,你的代码应该是:

data: {PartNumber: request.term },

当然,修复无效的HTML标记,删除任何重复的ID。

答案 1 :(得分:0)

将脚本更改为 -

True + "str"

并且您不能在一个页面上使用相同的ID。将您的HTML更改为 -

str(True) + "str"