jquery auto complete未显示结果

时间:2014-05-06 21:52:06

标签: php jquery json

我正在使用jquery auto complete从php中获取数据库中的当前数据。但是,我没有得到结果。

以下是代码示例:

<label class="col-md-4">Referrer</label>
<div class="col-md-6">
    <input type="text" name="referrer" id='referrer' placeholder="Type keyword..." autocomplete="off" value="" class="form-control" />
</div>

<script>
var path = $( "#referrer" ).data('path');
$("#referrer").autocomplete({
    source: function(request, response) {
        $.ajax({
            url: "/ajax/ir_populate_referrer",
            dataType: "json",
            type: "POST",
            data: {
                keyword: request.term,
                path: path
            },
            success: function(data) {
                response($.map(data, function(item) {
                    return {
                        label: item.label
                    }
                }));
            }
        })
    }
});
</script>

与我的search.php文件一样:

<?php
    echo json_encode(array('label'=> $link, 'value' => $keyword));
?>

1 个答案:

答案 0 :(得分:0)

<强> HTML

<html> 
    <head> 
        <title>test jquery autocomplete</title> 
        <script type="text/javascript" src="jquery/js/jquery-1.4.2.min.js"></script> 
        <script type="text/javascript" src="jquery/js/jquery-ui-1.8.2.custom.min.js"></script> 
        <script type="text/javascript"> 

            $(document).ready(function(){
                $("#zipsearch").autocomplete({
                    source: function(req,res) {
                        $.ajax({
                            url: "json.php",
                            dataType: "json",
                            type: "GET",
                            data: {
                                term: req.term
                            },
                            success: function(data) {
                                res($.map(data, function(item) {
                                    return {
                                        label: item.label,
                                        value: item.value
                                    };
                                }));
                            },
                            error: function(xhr) {
                                alert(xhr.status + ' : ' + xhr.statusText);
                            }
                        });
                    }
                });
            });

        </script> 
        <link rel="stylesheet" href="jquery/css/smoothness/jquery-ui-1.8.2.custom.css" /> 
        <style type="text/css">
        </style> 
    </head> 

    <body> 

        <form onsubmit="return false;"> 
            Ejemplo<br/>
            Enter a Zipcode:
            <input id="zipsearch" type="text" /> 
        </form>
    </body> 
</html>

<强> PHP

<?php
$response = array();
$response[0]=array('label'=>'test','value'=>'test');
$response[1]=array('label'=>'test2','value'=>'test2');
echo json_encode($response);
?>