【问题标题】:Sorting jQuery's Autocomplete Results排序 jQuery 的自动完成结果
【发布时间】:2015-10-27 07:26:37
【问题描述】:

我有一个链接到我的数据库的工作自动完成脚本,但我确定如何对结果进行排序。

我的表有 4 列:ID、位置、slug、人口。该表本身有大约 1,000 个条目。

目前,我的自动完成功能会在用户搜索 slug 时进行,它会搜索 slug,但我希望自动完成列表结果按人口顺序排序,列表中人口数量越高。

索引.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Autocomplete using PHP/MySQL and jQuery</title>
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>
</head>


<body>
    <div class="container">
        <div class="header">

        </div><!-- header -->
        <h1 class="main_title">Autocomplete using PHP/MySQL and jQuery</h1>
        <div class="content">
            <form>
                <div class="label_div">Type a keyword : </div>
                <div class="input_container">
                    <input type="text" id="slug" onkeyup="autocomplet2()">
                    <ul id="list_id"></ul>
                </div>
            </form>
        </div><!-- content -->    
        <div class="footer">
            Powered by Jason's Fingers</a>
        </div><!-- footer -->
    </div><!-- container -->
</body>
</html>

script.js:

// autocomplete : this function will be executed every time we change the text
function autocomplet2() {
    var min_length = 3; // min caracters to display the autocomplete
    var keyword = $('#slug').val();
    if (keyword.length >= min_length) {
        $.ajax({
            url: 'ajax_refresh.php',
            type: 'POST',
            data: {keyword:keyword},
            success:function(data){
                $('#list_id').show();
                $('#list_id').html(data);
            }
        });
    } else {
        $('#list_id').hide();
    }
}

// set_item : this function will be executed when we select an item
function set_item(item) {
    // Changes input to the full name on selecting
    $('#slug').val(item);
    // Hides list after selection from list
    $('#list_id').hide();
}

ajax_refresh.php:

<?php
// PDO connect *********



function connect() {
    return new PDO('mysql:host=localhost;dbname=wallettest', 'root', 'butthead', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION, PDO::MYSQL_ATTR_INIT_COMMAND => "SET NAMES utf8"));
}

$pdo = connect();
$keyword = '%'.$_POST['keyword'].'%';
$sql = "SELECT * FROM population WHERE slug LIKE (:keyword) ORDER BY id ASC LIMIT 0, 10";
$query = $pdo->prepare($sql);
$query->bindParam(':keyword', $keyword, PDO::PARAM_STR);
$query->execute();
$list = $query->fetchAll();
foreach ($list as $rs) {
    // put in bold the written text
    $slug = str_replace($_POST['keyword'], '<b>'.$_POST['keyword'].'</b>', $rs['slug']);
    // add new option
    echo '<li onclick="set_item(\''.str_replace("'", "\'", $rs['slug']).'\')">'.$slug.'</li>';
}


?>

【问题讨论】:

    标签: javascript php autocomplete


    【解决方案1】:

    您可以将$sql 的“ORDER BY”部分设置为:

    ...ORDER BY population DESC LIMIT 0, 10"
    

    【讨论】:

      【解决方案2】:

      想通了,在这一行:

      $sql = "SELECT * FROM country WHERE country_name LIKE (:keyword) ORDER BY country_id ASC LIMIT 0, 10";

      将 country_id 的顺序更改为人口

      【讨论】:

      • 好吧,看来你打败了我。不过,ASC 将首先为您提供最少的人口。
      • 谢谢你,我当时正摸不着头脑,如何弄清楚降序的语法是什么,你知道我在哪里可以查看各种命令吗?
      • 文档可以提供很多帮助。对于ORDER BY,您可以查看此link
      猜你喜欢
      • 1970-01-01
      • 2011-01-04
      • 1970-01-01
      • 1970-01-01
      • 2011-09-08
      • 1970-01-01
      • 2011-07-21
      • 2010-10-06
      • 1970-01-01
      相关资源
      最近更新 更多