Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][XML][JavaScript]Input - podpowiadanie
Forum PHP.pl > Forum > Przedszkole
Sobieski993
Witam

Chce zrobic formularz inputami i przy tych inputach podpowiadanie tekstu. Do tej pory do takich rzeczy uzywalem select2 - jednak select2 jest po prostu selectem z wyszukiwarka. A mi potrzeba skryptu, ktory bedzie mi podpowiadal jakas wartosc ale jednozesnie pozwalal wpisac wlasna.

Czy zna ktos taki?
PrinceOfPersia
ogólna nazwa na takie komponenty to autocomplete, typeahead.

ew. napisać własny komponent z takimi funkcjonalnościami jest bardzo prosto (input text do wpisywania tekstu, osobny div do pokazywania podpowiedzi, javascriptowa tablica do trzymania danych do podpowiadania, oraz kod JavaScript, który łączy zdarzenia klawiatury i pokazuje przefiltrowane wyniki).
kamilo818
Jasny gotowiec smile.gif

http://www.bewebdeveloper.com/tutorial-abo...ysql-and-jquery
Sobieski993
Dzieki wielkie Panowie.

@PrinceOfPersia - w sumie to wiekszosc mi nie pasowala

W kazdym razie znalazlem cos lepszego - jest dostepne dopiero w HTML5 i to zdaje sie, ze od niedawna, bo wczesniej o tym nei slyszalem. Mianowicie datalist

example:
  1. <!DOCTYPE html>
  2. </head>
  3. <h2>HTML Form Input Autocomplete datalist Tutorial</h2>
  4. Search:
  5. <input type="text" name="srch" id="srch" list="datalist1">
  6. <datalist id="datalist1">
  7. <option value="Canada">
  8. <option value="China">
  9. <option value="Mexico">
  10. <option value="United Kingdom">
  11. <option value="United States of America">
  12. <option value="Uruguay">
  13. </datalist>
  14. </body>
  15. </html>


takxe problem rozwiazany.
Dzieki za odpowiedzi smile.gif
PrinceOfPersia
o ciekawe, nie wiedziałem o tym (w zasadzie kiedyś chyba coś czytałem, ale i tak zapomniałem).

Z drugiej strony ta kontrolka podpowiada tylko po pierwszej literze, przynajmniej w Chrome: http://jsfiddle.net/jbyL9fn2/
wpiszesz exico i nie uzupełni na Mexico.
Comandeer
datalist jest dobre jeśli a) nie przeszkadza nam wyszukiwanie tylko po 1. literze cool.gif nie przeszkadza nam, że listę 10 000 opcji trzeba wstawić do kodu HTML zamiast pobierać Ajaksem w razie potrzeby wink.gif c) nie przeszkadza nam, że tego pola nie da się w żaden (ale to absolutnie żaden) sensowny sposób ostylować. W każdym innym wypadku odesłałbym do jQuery UI i ich autocomplete (jako jedyni przynajmniej próbują cokolwiek z ARIA, chociaż robią coś całkowicie innego niż to, co widnieje w specyfikacji wink.gif)
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.