Как использовать jQuery.autocomplete для скрытого поля ввода (тип = «текст»)?

#javascript #jquery #jquery-autocomplete

#javascript #jquery #jquery-автозаполнение

Вопрос:

Я пытаюсь использовать автозаполнение из jQuery для текстового поля внутри скрытого div. Похоже, это не работает, хотя поле ввода получает класс ui-autocomplete-input . Похоже, что никакое событие не привязано к моему вводу.

Чтобы было понятно, код выглядит так:

 <a href="#overlay" class="open-the-overlay-that-has-the-id-like-this-href-attribute">OPEN</a>

<div id="overlay" style="display:none">
    <form action="/action" method="post">
        <input type="text" id="my-unique-id" />
        <input type="submit" />
    </form>
</div>

<script type="text/javascript">
$(document).ready(function(){

    $("#my-unique-id").autocomplete({
        source: "search.php",
        minLength: 2
    });

});
</script>
  

После этого #my-unique-id получает класс ui-autocomplete-input, но не имеет привязки к событиям.
Есть идеи?

Вот скрипт на стороне сервера, но в нем нет ничего плохого, потому что в другом поле он работает нормально:

(CakePHP)

 function getCity() {

    $this->layout = FALSE;
    $this->autoRender = FALSE;
    Configure::write("debug",0);

    if(isset($_GET["term"]) amp;amp; !empty($_GET["term"])) {
        AppModel::unbind($this->City);
        preg_match_all("/(w )/",urldecode($_GET["term"]), $term);
        $or = array();
        foreach ($term[0] as $t) {
            if(strtolower($t) != "jud")
            $or[] = "City.name LIKE '%$t%'"; // OR City.county LIKE '%$t%'
        }
        $or = implode(" OR ", $or);
        $cities = $this->City->find("all", array("limit"=>30, "fields"=>array("City.id", "City.name", "City.county"),"conditions"=>array($or)));
        $returnArray = array();
        $k = 0;
        foreach($cities as $c) {
            $returnArray[$k]['id'] = $c["City"]["id"];
            $returnArray[$k]['label'] = $c["City"]["name"].", jud. ".$c["City"]["county"];
            $returnArray[$k]['value'] = $c["City"]["name"].", jud. ".$c["City"]["county"];
            $k  ;
        }
        return json_encode($returnArray);
    }
}
  

Ответ №1:

Ваш код верен, что может быть неправильным, так это ваш серверный скрипт, который не возвращает данные, и поэтому кажется, что ничего не происходит. Не могли бы вы опубликовать свой скрипт на стороне сервера?

Вы также можете попробовать использовать локальный источник данных:

     var availableTags = [
        "ActionScript",
        "AppleScript",
        "Asp",
        "BASIC",
        "C",
        "C  ",
        "Clojure",
        "COBOL",
        "ColdFusion",
        "Erlang",
        "Fortran",
        "Groovy",
        "Haskell",
        "Java",
        "JavaScript",
        "Lisp",
        "Perl",
        "PHP",
        "Python",
        "Ruby",
        "Scala",
        "Scheme"
    ];

 $("#my-unique-id").autocomplete({
        source: availableTags ,
        minLength: 2
    });
  

Комментарии:

1. Серверная часть работает нормально. Не могу использовать локальный источник данных, потому что у меня около 14000 записей в базе данных. Так что это не вариант!

2. @Lucian — Я думаю, Никола означает, что вы должны использовать локальный источник данных для проверки функциональности автозаполнения…

3. @Lucian из вашего примера неясно, где пользователь вводит текст, который должен быть «автозаполнен»

4. Не могли бы вы быть более конкретным @NicolaPeluchetti ?

5. @Lucian — автозаполнение работает, когда кто-то вводит текст во ввод. Когда ваш ввод скрыт (потому что он находится в скрытом div) — тогда никто не может на самом деле написать там текст? Или вы вставляете текст в этот ввод с помощью кода где-нибудь? Затем вам нужно вызвать это изменение в событии ввода с помощью вашего кода.