0

jQueryオートコンプリートを機能させるために何日も試みてきました。今のところ、テキストボックスに入力できるところまで来ており、必要なものが正確に表示されますが、問題は、必要なものをクリックしてもテキストボックスに表示されないことです。オートコンプリートと関係があることは知っていますが、一生理解できません。誰かが助けることができれば、それは大歓迎です。

index.php

<?php require('_php/functions.php') ?>
<!DOCTYPE HTML>
<html><head>
  <title>simple_light</title>
  <link rel="stylesheet" href="_style/main.css" />
</head>
<body>
            <h1> Autocomplete with jQuery</h1>
            <input type="text" name="autosuggest" id="autosuggest" onKeyUp="autoSuggest();"/>
            <div id="autosuggest-container"></div>
            <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
            <script src="_scripts/functions.js"></script>
</body>
</html>

functions.js

function autoSuggest(){

var autosuggestVal = $('#autosuggest').val();

    if (autosuggestVal != ''){
        $.ajax({
            url: '_php/ajax/autosuggest.php?query='+autosuggestVal,
            success: function(result){
                $('#autosuggest-container').html(result);
            }
        });
    }

}

関数.php

<?php 
require('config.php');

function autoSuggest($query){

    $connect = mysql_connect(DB_HOST, DB_USER, DB_PASS) or die(mysql_error());
    mysql_select_db(DB_NAME, $connect);

    $sql = "
    SELECT Location.LocationID, CONCAT_WS(' ', SystemName, SiteNameLocation, SiteAddress1, SiteCity, SiteProvince, SitePostalCode) as expr2 
    FROM Location 
    WHERE Location.SystemName like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteNameLocation like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteAddress1 like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteCity like '%".mysql_real_escape_string($query)."%'
    OR Location.SiteProvince like '%".mysql_real_escape_string($query)."%'
    OR Location.SitePostalCode like '%".mysql_real_escape_string($query)."%'
    ";

    $result = mysql_query($sql, $connect);
    $totalRows = mysql_num_rows($result);

    if ($totalRows > 0){
        $items = '<ul class="autosuggest">';

        while ($row = mysql_fetch_assoc($result)){

            $items .= '<li>'.$row['expr2'].'</li>';

        }

        $items .= '</ul>';

    }
    else{
        $items = 'no results found';
    }

    echo $items;

}
?>

autosuggest.php

<?php 
require('../functions.php');
autoSuggest($_GET['query']);
?>
4

1 に答える 1

0

提案にクリックイベントハンドラーを提供していないのは私の強い疑いです-方法を教えていない場合、値を設定する方法をどのように知っていますか?

この大まかな例を参照してください（毎回単純な「こんにちは」応答へのajax呼び出しをモックアウトしました）

http://jsfiddle.net/KyleMuir/X2K4K/2/

オブジェクトではなく JS で 2 つのイベントを接続します。はるかに簡単で優れています。

$('#autosuggest').on('keyup', autoSuggest);
$('#autosuggest-container').on('click', setValue)

ご覧のとおり、keyup イベントは autosuggest id にバインドされ、onclick イベントは autosuggest-container にバインドされています。

autosuggest-container (別名、選択したい項目) をクリックすると、値が設定されます。

注:あなたの例では、関心のある項目を setValue 関数に渡す必要があるでしょう。YMMV

お役に立てれば。

于 2013-09-17T02:45:10.040 に答える