selezioni multiple con il datalist

Sto utilizzando il tag per creare un elenco di suggerimenti per la mia casella di ricerca, ma non riesco a selezionare più valori dal datalist. Attualmente, il mio HTML è:selezioni multiple con il datalist

<html> 

    <form action="search_tags.php" method="GET"/> 

    Search: <input type="text" multiple="multiple" name="search" list="tags" autocomplete="off" /> 

    <datalist id="tags"> 
    <option value="black"> 
    <option value="gold"> 
    <option value="grey"> 
    <option value="pink"> 
    <option value="turquoise"> 
    <option value="red"> 
    <option value="white"> 
    </datalist> 

</html>

Esso offrirà suggerimenti per un elemento, ma dopo che i suggerimenti non suggerire un completamento automatico per la mia seconda opzione. Pensavo che il tag "multiplo" fosse tutto ciò di cui avevo bisogno (e ciò che è suggerito online) ma non sembra avere l'effetto desiderato.

Qualche suggerimento?

fonte

2013-01-03 nathan lachenmyer

Secondo MDN, più si applica solo ai tipi "email" e "file". Penso che sei sfortunato per un campo di testo tradizionale, e potrebbe dover usare qualcosa come select2.js –

Che sfortuna :(C'è qualche tipo di pacchetto javascript che non usa jquery che può fare questo? –

La maggior parte di dipendono da una libreria poiché c'è una quantità decente di manipolazioni del DOM. C'è select2 (jQuery), scelto (jQuery o Prototype), jQuery UI autocomplete (jQuery) .Per quel momento si entrerà in soluzioni meno affidabili. 't you use jQuery? –

multipla attualmente lavorando solo con input type = "email" e solo in Chrome e Opera

un'occhiata a questo esempio minimalista:

<input type="email" list="emails" multiple> 
<datalist id="emails"> 
    <option value="[email protected]"> 
    <option value="[email protected]"> 
    <option value="[email protected]"> 
    <option value="[email protected]"> 
</datalist> 

<input type="text" list="texts" multiple> 
<datalist id="texts"> 
    <option value="black"> 
    <option value="gold"> 
    <option value="grey"> 
    <option value="pink"> 
    <option value="turquoise"> 
    <option value="red"> 
    <option value="white"> 
</datalist>

(http://jsfiddle.net/iiic/t66boyea/1/)

Primo ingresso sarà funzionante, secondo NOT. Si preme solo la virgola e l'elenco apparirà uguale a quello inserito nell'ingresso.

fonte

2014-10-15 09:44:17 iiic

Qualcuno sa perché solo 'type =" email "' è supportato atm? Così bizzarro! –

According to this attributo 'multipla' è valida solo con email e tipi di ingresso di file.

fonte

2016-02-05 18:57:38 Blue

datalist su misura per accettare più valori:

https://jsfiddle.net/bhbwg0rg/1/

Dopo ogni inserimento stampa , e barra spaziatrice)

<label for="authors">Type authors from favorite to least favorite</label> 
<input type="text" list="names-list" id="authors" value="" size="50" name="authors" placeholder="Type author names"> 
<small>You can type how many you want.</small> 
<datalist id="names-list"> 
    <option value="Albert Camus"> 
    <option value="Alexandre Dumas"> 
    <option value="C. S. Lewis"> 
    <option value="Charles Dickens"> 
    <option value="Dante Alighieri"> 
</datalist>

Fonte: https://codepen.io

fonte

2017-11-10 22:54:22 Neil

selezioni multiple con il datalist

risposta

Problemi correlati