Ciao a tutti,
ho un form con due campi input text aventi stessa classe associati allo stesso autocomplete in jQuery tramite la classe.
Fin qui tutto ok, anche se non riesco a far visualizzare la lista con solo le parole che iniziano per quella lettera digitata ma vengono fuori tutte le parole che la contengono es. digito "c" e visualizzo "occhio, cane, macchina" e mi piacerebbe visualizzare solo "cane, casa".
Come da titolo avrei bisogno di sapere come far si che in quei due input text si possano digitare solo caratteri corrispondenti ai valori dell'autocomplete e non come ora che si può inserire qualunque carattere che appunto non è contenuto nell'autocomplete.
Posto il file che includo nel mio form dove ho l'autocomplete.
codice HTML:
[COLOR=#4E9192][FONT=Monaco]<!doctype html>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco]<html lang="en">[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco]<head>[/FONT][/COLOR]
[COLOR=#932192][FONT=Monaco] <meta charset="utf-8">[/FONT][/COLOR]
[COLOR=#3933FF][FONT=Monaco] <meta name="viewport" content="width=device-width, initial-scale=1">[/FONT][/COLOR]
[COLOR=#4F76CB][FONT=Monaco] <!-- <title>jQuery UI Autocomplete - Scrollable results</title> --> [/FONT][/COLOR]
[COLOR=#3933FF][FONT=Monaco] <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">[/FONT][/COLOR]
[COLOR=#3933FF][FONT=Monaco] <link rel="stylesheet" href="/resources/demos/style.css">[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco] <style>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco] .ui-autocomplete {[/FONT][/COLOR]
[COLOR=#932192][FONT=Monaco] max-height: 100px;[/FONT][/COLOR]
[COLOR=#932192][FONT=Monaco] overflow-y: auto;[/FONT][/COLOR]
[COLOR=#4F76CB][FONT=Monaco] /* prevent horizontal scrollbar */[/FONT][/COLOR]
[COLOR=#932192][FONT=Monaco] overflow-x: hidden;[/FONT][/COLOR]
[FONT=Monaco] }[/FONT]
[COLOR=#4F76CB][FONT=Monaco] /* IE 6 doesn't support max-height[/FONT][/COLOR]
[COLOR=#4F76CB][FONT=Monaco] * we use height instead, but this forces the menu to always be this tall[/FONT][/COLOR]
[COLOR=#4F76CB][FONT=Monaco] */[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco] * html .ui-autocomplete {[/FONT][/COLOR]
[FONT=Monaco] height: 100px;[/FONT]
[FONT=Monaco] }[/FONT]
[COLOR=#4E9192][FONT=Monaco] </style>[/FONT][/COLOR]
[COLOR=#3933FF][FONT=Monaco] <script src="https://code.jquery.com/jquery-1.12.4.js"></script>[/FONT][/COLOR]
[COLOR=#3933FF][FONT=Monaco] <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco] <script>[/FONT][/COLOR]
[FONT=Monaco] $( function() {[/FONT]
[FONT=Monaco] var availableTags = [[/FONT]
[COLOR=#3933FF][FONT=Monaco] "casa", "cane", "moto", "scooter", "auto", "trattore","aereo"[/FONT][/COLOR]
[FONT=Monaco] ];[/FONT]
[FONT=Monaco] $( ".autom" ).autocomplete({[/FONT]
[FONT=Monaco] source: availableTags[/FONT]
[FONT=Monaco] });[/FONT]
[FONT=Monaco] } );[/FONT]
[FONT=Monaco]
[/FONT]
[COLOR=#4E9192][FONT=Monaco] </script>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco]</head>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco]<body>[/FONT][/COLOR]
[FONT=Monaco] [/FONT]
[COLOR=#4E9192][FONT=Monaco]</body>[/FONT][/COLOR]
[COLOR=#4E9192][FONT=Monaco]</html>
[/FONT][/COLOR]
Ho guardato la guardato la documentazione di jQuery ma non sono riuscito a venirne a capo.
Ringrazio tutti in anticipo