jQuery и Grails / HTML - сделайте текстовое поле полным текстом, как это делает Google - PullRequest
Новая
       2

jQuery и Grails / HTML - сделайте текстовое поле полным текстом, как это делает Google

3 голосов
/ 06 октября 2010

Я хочу заполнить определенные поля на своей странице, чтобы они отображались как список возможных завершающих предложений, как это делает Google.

Я думаю, что это делается через jQuery, но я не уверен.

Текстовое поле называется товаром.

Допустим, я пишу General, а в списке, массиве или DB у меня есть General Commodity. Я должен показать мне General Commodity в текстовом поле.

Заранее спасибо!

------- UPDATE ------- 

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js">
var data = "General Commodity,General Store,General Custer,General Mills".split(",");

    $("#Ccommodity").autocomplete({
            source: data
        });
</script>

Когда я иду в текстовое поле ввода Ccommodity, я пишу G, и ничего не происходит, возможно, у меня есть какая-то синтаксическая ошибка там.

Спасибо за помощь

Ответы [ 2 ]

4 голосов
/ 06 октября 2010

Возможно, вам захочется заглянуть в jQueryUI Автозаполнение виджета . У него есть несколько способов предоставления списков предложений, и там почти наверняка найдется что-то, что подойдет вам.

Вот очень простая демонстрация: http://jsfiddle.net/QU9st/

Вот источник для этого: 

$(function() {
    var data = "General Commodity,General Store,General Custer,General Mills".split(",");
    $("#commodity").autocomplete({
            source: data
        });
});

Эта демонстрация просто использует статический массив строк в качестве источника данных, но вы также можете использовать удаленные источники данных в таких форматах, как JSON или XML.

Чтобы получить это, просто поместите это где-нибудь в свой тег <head>: 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>

Конечно, вам также нужно включить jQuery: 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
3 голосов
/ 06 октября 2010

jQuery имеет виджет автозаполнения , который может заставить его делать то, что вы хотите.Вот пример: jQuery: 

var data = "Core Selectors Attributes Traversing Manipulation CSS Events Effects Ajax".split(" ");
$("#commodity").autocomplete(data);

html: 

<input type="text" id="commodity" name="commodity">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...