2011-04-27 13 views
5

Tengo una lista que quiero incluir en otra lista. Sin embargo, jQuery Mobile desea crear una página separada para la lista incrustada.¿Cómo forzar a una lista anidada a mantenerse en línea con jQuery Mobile?

Aquí es lo que tengo:

<ul data-role="listview"> 
    <li>Item 1</li> 
    <li> 
     Item 2 
     <ol> 
      <li><p>Embedded item 1</p></li> 
      <li><p>Embedded item 2</p></li> 
     </ol> 
    </li> 
</ul> 

yo preferiría una solución que no toque el interior de la lista ya que en realidad está siendo promocionado de una fuente externa.

¿Hay alguna manera de hacer que la lista se visualice en línea?

Respuesta

5

Esto es algo que ha cambiado entre alpha3 y alpha4. Todo lo que necesita hacer es envolver el archivo en un div y se mostrará (No es muy bonito, pero se mostrará)

Desde allí puede hacer que sea una lista y configurarlo para que se vea un poco mejor .

Ver: http://jsfiddle.net/MyHaB/1/

+0

¡Excelente! Una pregunta más rápida ... en su ejemplo, noté que el número en la lista anidada estaba en una línea separada. ¿Hay alguna manera de arreglar eso? –

+0

Quitar la etiqueta P lo arreglará por usted. Si lo quieres diferente, deberás echarle un vistazo a algunos de los css. – dkarzon

0

Para aquellos que buscado en Google para encontrar una solución similar a este.

Otra forma de hacerlo es utilizar el complemento inlinelistview. Permite que los elementos de la vista de lista se abran en línea dentro de la lista y el usuario los vuelva a cerrar de nuevo.

On Github

Cuestiones relacionadas