Question

我们正在创建一个电子商务网站，在UI中我们保留了一个搜索栏，它必须从数据库中搜索数据它正在从数据库中获取数据

为了创建，我们使用了以下j-query代码

 <script>
            $(document).ready(function(){
                var dataAutoComplete=[];
                var parameters = { search: "Pling" };
                $.get( '/search_product',parameters, function(data) {
                    var dataAutoComplete=[];
                    $.each(data.products,function(index,value){
                        var tempStringJSON=JSON.stringify(dataAutoComplete);
                        if(tempStringJSON.indexOf(value.subcategory+" in "+ value.category)==(-1)){
                            dataAutoComplete.push(value.subcategory+" in "+ value.category);
                        }
                    });
                    $.each(data.products,function(index,value){
                        var tempStringJSON=JSON.stringify(dataAutoComplete);
                        if(tempStringJSON.indexOf(value.brand+" in Brands")==(-1)){
                            dataAutoComplete.push(value.brand+" in Brands");
                        }
                    });
                    $.each(data.products,function(index,value){
                      var tempStringJSON=JSON.stringify(dataAutoComplete);
                        if(tempStringJSON.indexOf(value.product_name+" of "+ value.brand)==(-1)){
                            dataAutoComplete.push(value.product_name+" of "+ value.brand);
                        }

                    });

                  $("#searchBox").autocomplete({
                        source:dataAutoComplete

                    });
                });


                $("#searchBox").on('autocompletechange change',function(){
                    var selectedItem=$(this).val();
                    if(selectedItem.indexOf(" in Brands")!=(-1)){
                        window.location.href = '/prod_grid?brand='+selectedItem.substring(0,selectedItem.indexOf(" in Brands"));
                        index.location.href= '/prod_grid?brand='+selectedItem.substring(0,selectedItem.indexOf(" in Brands"));
                    }
                    else if(selectedItem.indexOf(" in ")!=(-1)){
                        window.location.href = '/prod_grid?prod='+selectedItem.substring(0,selectedItem.indexOf(" in "));

                    }
                    else if(selectedItem.indexOf(" of ")!=(-1)){
                        window.location.href = '/prod_grid?prod='+selectedItem.substring(0,selectedItem.indexOf(" of "))+'&brand='+selectedItem.substring(selectedItem.indexOf(" of ")+4,selectedItem.length);
                    }

                }).change();

代码工作正常，但我们的挑战是[！[在我们点击db中的选择选项的图像中，它自动填充到搜索窗口，当我们点击进入时，那时只有它正在搜索db < / p>

现在我的要求是当我们从下拉列表中选择数据时，它必须直接搜索不将数据添加到窗口并再次单击就像Chrome浏览器网址点击

一样

如何创建搜索栏自动填写搜索

0 个答案: