Question

我正在尝试使用jquery ui自动完成功能从变量php文件加载数据，具体取决于用户看到的单选按钮，但我无法检索任何数据，而是出现此错误：

jquery-ui.js:6015 Uncaught TypeError: this.source is not a function
    at $.(anonymous function).(anonymous function)._search (https://code.jquery.com/ui/1.12.1/jquery-ui.js:6015:8)
    at $.(anonymous function).(anonymous function)._search (https://code.jquery.com/ui/1.12.1/jquery-ui.js:144:25)
    at $.(anonymous function).(anonymous function).search (https://code.jquery.com/ui/1.12.1/jquery-ui.js:6007:15)
    at $.(anonymous function).(anonymous function).search (https://code.jquery.com/ui/1.12.1/jquery-ui.js:144:25)
    at $.(anonymous function).(anonymous function).<anonymous> (https://code.jquery.com/ui/1.12.1/jquery-ui.js:5988:10)
    at handlerProxy (https://code.jquery.com/ui/1.12.1/jquery-ui.js:641:6)

这是我的代码：

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>

<script>
$(function(){

    var selected;
    var search_php;

    $('#myForm input').on('change', function() {
        selected = $('input[name=radioName]:checked', '#myForm').val();

        if(selected == 1)
        {
            search_php = '"' + "name_search.php" + '"';
            console.log(search_php);
        }
        else if(selected == 2)
        {
            search_php = '"' + "brand_search.php" + '"';
            console.log(search_php);
        }
        else if(selected == 3)
        {
            search_php = '"' + "serial_search.php" + '"';
            console.log(search_php);
        }
        else if(selected == 4)
        {
            search_php = '"' + "location_search.php" + '"';
            console.log(search_php);
        }
    });

    $('#txtSearch').autocomplete({
        source: search_php,
        minLength: 3
    }).data("ui-autocomplete")._renderMenu = function (ul, items) {
                $("#table_body tbody tr").remove();
                $.each( items, function( index, item ) {
                var table = $("#table_body");
                if (item.items_name != '#') {
                table.append("<tr><td>"+item.items_name+"</td><td>"+item.items_brand+"</td><td>"+item.item_serial+"</td><td>"+item.location_name+"</td><td>"+item.items_desc+"</td>");
                }
                else
                {
                    $("#table_body tbody tr").remove();
                }
                });
            };

    $('#txtSearch').keyup(function(event){ 
        //run the character number check  
        if($('#txtSearch').val().length < 3){  
            $("#table_body tbody tr").remove();
        }
    });

});
</script>

Answer 1

我设法通过添加一个外部函数（getData）将其传递给source函数中的autocomplete以获取我的php文件的响应然后将其提取到我的表通过autocomplete函数。

我的新代码：

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>

<script>
$(function(){

    var selected = 1;
    var search_php = "name_search.php";

    $('#myForm input').on('change', function() {
        selected = $('input[name=radioName]:checked', '#myForm').val();

        if(selected == 1)
        {
            search_php = "name_search.php";
        }
        else if(selected == 2)
        {
            search_php = "brand_search.php";
        }
        else if(selected == 3)
        {
            search_php = "serial_search.php";
        }
        else if(selected == 4)
        {
            search_php = "location_search.php";
        }
    });

    var getData = function (request, response) {
            $.ajax({
              type: "POST",
              url:search_php,
              data: request,
              success: response,
              dataType: 'json'
            });
    };

    $('#txtSearch').autocomplete({
        source: getData,
        minLength: 3
    }).data("ui-autocomplete")._renderMenu = function (ul, items) {
                $("#table_body tbody tr").remove();
                $.each( items, function( index, item ) {
                var table = $("#table_body");
                if (item.items_name != '#') {
                table.append("<tr><td>"+item.items_name+"</td><td>"+item.items_brand+"</td><td>"+item.item_serial+"</td><td>"+item.location_name+"</td><td>"+item.items_desc+"</td>");
                }
                else
                {
                    $("#table_body tbody tr").remove();
                }
                });
            };

    $('#txtSearch').keyup(function(event){ 
        //run the character number check  
        if($('#txtSearch').val().length < 3){  
            $("#table_body tbody tr").remove();
        }
    });

});
</script>

jquery autocomplete变量php文件到源代码

1 个答案: