Buenas tardes.
Estoy haciendo una aplicación para móviles con jquery mobile y tengo un problema con los elementos collapsible.
Hago una llamada ajax al servidor para obtener datos, y si la respuesta es correcta lo que quiero es insertar tantos elementos collapsibles como respuestas del servidor.
Codigo html:
<div data-role="page" id="paginaListado">
<div data-role="header">
<h1>Listado</h1>
</div>
<div data-role="content">
<div id="seccionListadoMaterial"></div>
</div>
</div>
Código javascript:
$("#seccionListadoMaterial").html("");
$.ajax({
type: "POST",
url: "php/listadoMaterial.php",
cache: false,
success: function(data){
for(var i = 0 ; i < 4 ; i++){
$("#seccionListado").append("<div data-role='collapsible'><h3>Esto es lo de fuera</h3><p>Y esto lo de dentro</p></div>");
}
}
});
$.mobile.changePage('#paginaListado');
Si la hago como muestro aquí arriba, se ve de esta forma:
En cambio, si en vez de hacer el for dentro del succes de ajax lo hago fuera, se ve ok:
Necesito hacerlo dentro de la llamada ajax para poder poner al collapsible el texto que recibo del servidor.
He probado a cambiar el tema, pero nada, también he probado a hacerlo "collapsible-set" pero lo mismo.
¿Por qué puede estar pasando?
Saludos.
$("#seccionListado")
, esta mal. Debería ser $("#seccionListadoMaterial") – Marcos el 28 dic. 17 a las 14:34