Кутия с предложения за въвеждане на текст в HTML формуляр

Опитвам се да модифицирам едно от моите полета за въвеждане на текст във форма, която имам. Бих искал предложенията да изскачат, докато потребителят въвежда. По принцип бих искал да емулирам полето „Етикети“, което е на страниците за задаване на въпроси тук, в Stack Overflow, но с различни данни като очевидно предложенията. Как да направя това?

За контекст, това е за клуб в колеж и аз се опитвам да позволя на членовете да въвеждат специалностите си и докато пишат, да излизат предложения.


person Ross Larson    schedule 23.06.2011    source източник


Отговори (3)


jQuery има добавка за автоматично довършване, която можете да използвате.

Зависи какъв език/платформа/и т.н. вие също използвате. Аз съм предимно .NET разработчик и съм използвал следното:

  1. SQL Server за съхранение на данни
  2. Уеб формуляри или MVC за уеб приложението
  3. Манипулатор на ashx за извличане и форматиране на предложенията
  4. Приставката jQuery по-горе за изобразяване на резултатите, върнати от ashx под поле за въвеждане
person webtrifusion    schedule 23.06.2011

Този фрагмент от Cena Mayo направи току-що какво търсих:

<input id="color" list="suggestions">
<datalist id="suggestions">
    <option value="Black">
    <option value="Red">
    <option value="Green">
    <option value="Blue">
    <option value="White">
</datalist>

Документация

person Nathan Arthur    schedule 12.04.2019
comment
Хубаво решение. Само бележка обаче, datalist изглежда не работи на Android... bugs.chromium.org/p/chromium/issues/detail?id=949555 - person Kyle; 30.12.2019

Е, ако искате да получите информация от база данни за често използвани или вече създадени елементи, ще ви трябва нещо повече от html. Ако просто искате формулярът да предлага неща, които хората вече са въвели в собствените си сесии на сърфиране, формулярът ще направи това автоматично.

Това, към което мога да ви насоча, е тази публикация на момчета. Той очертава и дава основния код, за да започнете по пътя за автоматично предлагане във формуляри. Той дори ви дава файловете, за да започнете, но ще трябва да извършите известна модификация.

Също така включено по-късно в публикацията, някой добавя това, за да влезе във файла ajax_framework.

`функция clearsuggest() {

e = document.getElementById('резултати');

e.style.display="няма"; } `

В search.php: onClick="fill();clearsuggest();return false;"

Тази част от кода ще изчисти предложенията при щракване върху предложение. Надявам се това да помогне и успех.

person Jem    schedule 23.06.2011
comment
Това изглежда страхотно. Така че ще работи ли това, ако не мога да получа MySQL база данни (все пак мога да получа sqlite3 db)? - person Ross Larson; 24.06.2011