使用IF语句的jQuery自动完成

时间:2013-09-09 13:42:52

标签: php jquery asp.net sql autocomplete

希望这是一个简单的问题,我正在使用jQuery自动完成功能,它正常工作,并根据LIKE $querystring的SQL查询返回值。

现在我想在我的ASPX页面上添加一个额外的下拉列表,它将根据所选内容运行不同的SQL查询,这将在用户输入的同时传递给Search.php。自动填充字段。

所以简单地说,我想使用下拉列表来搜索SQL数据库中的不同行,并根据该行返回自动完成结果。有人可以帮助我从ASPX方面,以及如何从PHP端读取值。

ASPX代码与此http://jqueryui.com/autocomplete/#remote

类似

由于

1 个答案:

答案 0 :(得分:0)

是!!

从aspx方面: 你有多种方法可以做到这一点,但我更喜欢Bootstrap的TypeAhead

这里添加数据提供属性

您可以使用

    <asp:TextBox ID="ucUserSearch" runat="server" class="typeahead" 
   data-provide="typeahead" placeholder="Enter text" autocomplete="off" 
    data-items="4" />

然后从服务器端使用json字符串化对象传递来自search.php的数据。

使用url作为search.php进行ajax调用,并将数据源附加到 文本框。

这是我在最近的一个项目中使用的示例代码。我的意思是你可以写一个 类似的代码来实现结果。

这里我们使用了typeahead类,所以让我们通过Jquery

选择那个元素
 jQuery(function ($) {
        $('.typeahead').typeahead({
            source: function (query, process) {

                return $.ajax({
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    url: "search.php",
                    data: '{ "prefixText": "' + query + '" }',
                    dataType: "json",
                    success: function (data) {
                        //On Success lets return the values
                        //Please make sure to check how the json data is 
                         //coming I had to use data.d in my case
                        var jsonData = FetchedData(data.d);
                        return process(jsonData);
                    },
                    failure: function (response) {
                        alert("Failure");
                    },
                    error: function (jqXHR, textStatus, errorThrown) {
                        alert("There seems to be an error");
                    }
                });
            }
        });
    });


function FetchedData(data) {
            return data;
        }

干杯!!!

注意:这里我使用了bootstrap.css,jquery和bootstrap.min.js文件,请make 一定要包括这些