Php 设置输入字段的值而不刷新页面_Php_Javascript_Jquery

Php 设置输入字段的值而不刷新页面

php javascript jquery

Php 设置输入字段的值而不刷新页面,php,javascript,jquery,Php,Javascript,Jquery,我正在尝试使用AJAX自动完成用户文本。现在，我使用AJAX将自动完成功能所需的结果返回给“建议”div，以供用户输入。然而，我试图实现的是，在输入字段prod name中出现一个下拉列表，其中建议作为选项，用户只需单击他们喜欢的建议，并将其作为输入的“值”，类似于您键入时谷歌搜索建议的方式，只是一个简化版本到目前为止，我的看法是： <script type="text/javascript"> function search(searchword) { $('

我正在尝试使用AJAX自动完成用户文本。现在，我使用AJAX将自动完成功能所需的结果返回给“建议”div，以供用户输入。然而，我试图实现的是，在输入字段prod name中出现一个下拉列表，其中建议作为选项，用户只需单击他们喜欢的建议，并将其作为输入的“值”，类似于您键入时谷歌搜索建议的方式，只是一个简化版本

到目前为止，我的看法是：

<script type="text/javascript">
    function search(searchword) {
      $('#suggestion').load('invoice-get-data.php?searchword=' + searchword);
    }
</script>
</head>
<body>

<div class="prod-name">
    <input onKeyPress="search(this.value)" type="text" id="prod-name"/>
    <div id="suggestion"></div>
</div>
</body>

到目前为止，我的AJAX代码invoice-get-data.php代码片段

$searchword = $_GET['searchword'];

    $results = mysql_query("SELECT * FROM products WHERE prod_name LIKE '".$searchword."%'") or die(mysql_error());

    while($row = mysql_fetch_array($results)){
        echo $row['prod-name'] . '<br>';
    }

jquery ui为此类自动完成提供了一个小部件：

javascript方面应该是：

<script>
$(function() {
    $( "#prod-name" ).autocomplete({
        source: "invoice-get-data.php",
        minLength: 2,
        select: function( event, ui ) {
            alert("Product #" + ui.item.id + " selected");
            return true;
        }
    }
    });
});
</script>

$searchword = $_GET['term'];

$results = mysql_query("SELECT * FROM products WHERE prod_name LIKE '".$searchword."%'") or die(mysql_error());

$data = array();
while($row = mysql_fetch_array($results)){
    $data[]     = array(
        "id"        => $row['id'],
        "value"     => $row['prod-name'],
        "label"     => $row['prod-name']
    );
}   

echo json_encode($data);

请不要使用mysql函数来编写新代码。它们不再得到维护，社区已经开始。看到了吗？相反，你应该学习并使用或。如果你不能决定哪一个，我会帮你的。如果您选择PDO。目前，您的代码可以接受SQL注入。谢谢您的回复。我会记住的。但是，我目前正在使用测试服务器，SQL注入不应阻止我成功运行脚本。感谢您的回复！我很感激。我不明白如何在javascript函数中收集php数组数据，以便在jquery自动完成代码中设置源代码：$data array？中的值。。。我正在尝试使用您包含的手动链接中的方法，该链接将“源”值设置为数组对象。在“选择”事件中，object ui.item包含$data数组id、value、label或您在$data中添加的任何索引的值