¿Cómo crear un cuadro de lista en HTML sin permitir una selección múltiple?

97

No tengo mucha experiencia en HTML. Estoy buscando crear un cuadro de lista simple, pero uno de los requisitos es DESACTIVAR la selección múltiple. La mayor parte del código de los cuadros de lista es así:

 <select name="sometext" multiple="multiple">
    <option>text1</option>
    <option>text2</option>
    <option>text3</option>
    <option>text4</option>
    <option>text5</option>
 </select>

Pero esto permite una selección múltiple.

Aquí , se hizo una pregunta similar, pero la "mejor" respuesta ha sido rechazada. Así que no estoy seguro de cómo se podría hacer esto. Por favor ayuda.

html listbox

— Código Azul
fuente

5

Para ustedes, otros recién llegados, eviten el sitio web mencionado anteriormente por su propio bien: tienen un buen SEO, pero eso es todo. Está plagado de malas prácticas y hábitos que lamentará haber aprendido más adelante. Utilice la API de MDN (Mozilla), en este caso developer.mozilla.org/en-US/docs/Web/HTML/Element/select .

— Ben

3

@Steve gracias por la advertencia. Su comentario "Por eso tengo un trabajo" también pareció arrogante. Si tienes trabajo, bien por ti. Este es un foro de respuestas y no de anuncios.

— CodeBlue

170

Solo usa el atributo de tamaño:

<select name="sometext" size="5">
  <option>text1</option>
  <option>text2</option>
  <option>text3</option>
  <option>text4</option>
  <option>text5</option>
</select>

Para aclarar, agregar el atributo de tamaño no eliminó la selección múltiple.

La selección única funciona porque eliminó el atributo multiple = "multiple".

Agregar el atributo size = "5" sigue siendo una buena idea, significa que se deben mostrar al menos 5 líneas. Vea la referencia completa aquí

— Aaroncatlin
fuente

2

Voto a favor de la verdad. Además, cuando la pregunta se publicó anteriormente, es posible que esta solución no haya sido tan ampliamente admitida por todos los navegadores.

— Aaroncatlin

Probablemente fue rechazado porque no hay nada en los estándares HTML que requiera que el navegador lo represente como un cuadro de lista si se establece el atributo de tamaño. Sí, todos los navegadores principales lo hacen actualmente, pero no hay garantía de que siempre lo hagan. Sin embargo, de manera realista, este sería un cambio importante para muchos sitios web, es probable que ningún navegador lo cambie.

— Elezar

1

El estándar está abierto a una pequeña interpretación: "El tamaño de visualización de un elemento seleccionado es el resultado de aplicar las reglas para analizar enteros no negativos al valor del atributo de tamaño del elemento , si tiene uno y el análisis es exitoso". Si bien esto no indica específicamente que debe mostrarse como un menú desplegable o un cuadro de lista, sería difícil mostrar un control desplegable que muestre más de 1 elemento. ( html.spec.whatwg.org/#the-select-element )

— aaroncatlin

¡¡Gracias!! Y esto podría ser dinámico, obviamente, con Js: D

— Jcc.Sanabria

56

Elimine el atributo multiple = "multiple" y agregue SIZE = 6 con la cantidad de elementos que desee

es posible que desee consultar este sitio

http://www.htmlcodetutorial.com/forms/_SELECT.html

— pollirrata
fuente

2

Para Asp.Net MVC

@Html.ListBox("parameterName", ViewBag.ParameterValueList as MultiSelectList, 
 new { 
 @class = "chosen-select form-control"
 })

o

  @Html.ListBoxFor(model => model.parameterName,
  ViewBag.ParameterValueList as MultiSelectList,
   new{
       data_placeholder = "Select Options ",
       @class = "chosen-select form-control"
   })

— Deshani Tharaka
fuente