Tengo un problema con un código y honestamente no puedo resolverlo. Al menos ahora no he encontrado una solución.
Tengo en una base de datos información de la siguiente manera:
id id_videos
1 video1
2 video2
3 video3
4 video4
5 video5
6 video6
Mediante un query los ordeno de manera descendente.
Bueno, con una función en javascript, llamo esos videos, como son id's asociados a un id de youtube, la idea es mostrarlos en una página en el orden que están en la base de datos, pero de manera descendete, por ello mencioné el query:
id id_videos
6 video6
5 video5
4 video4
3 video3
2 video2
1 video1
bueno, la función de javascript muestra los videos en la página, sin embargo, como las llamadas a youtube las realizo mediante getJSON, la información llega en orden disinto, el cual es el que toma la función para pintarlos, p.ej:
id id_videos
2 video2
1 video1
3 video3
6 video6
5 video5
4 video4
la función que utilizo es la siguiente:
Código:
Como se darán cuenta, trato de meter la información en un array para después utilizarlo, sin embago, como la información regresa de manera asíncrona, no viene en el orden que estaba en mi base de datos, sino como llega de la internet. /*En esta función obtendremos los ids de las dos filas de videos */ function nueva_cadena(){ /* Inicializamos todas las variables a utilizar */ var Video = new Array(); var titulos = new Array(); var id = new Array(); var descripcion = new Array(); var fecha = new Array(); /* Aquí guardaremos toda la información obtenida */ var datosObt = new Array(); /* Con el método Ajax traemos la información de los id's de los videos que están en la base de datos */ $.ajax({ type: "get", url: "../com/datos.cfc", /* URL del archivo .cfc con funciones*/ data:"method=listaVideosJSON", dataType: "json", success: function(resultado){ resultado = eval(JSON.parse(resultado)); /* Se empiezan a crear los objetos con los datos de la tabla */ var columna = new Object(); for(var i = 0; i < resultado.COLUMNS.length; i++) { columna[resultado.COLUMNS[i]] = i; } /* El contenedor videos_fila, se comienza a crear con los demás elementos que contednrá */ $('.videos_fila').html('<ul id="videolista" style="display:inline-block;"></ul>'); /* Hacemos un for para ir llenando el arreglo que contendrá los videos */ for(j = 1; j < resultado.DATA.length; j++) { Video[j] = resultado.DATA[j][columna["VID_IDYT"]]; var url = "http://gdata.youtube.com/feeds/api/videos?q=" + Video[j] + "&max-results=1&v=2&alt=jsonc&callback=?"; /* Con el método getJSON traemos los datos de un XML externo */ $.getJSON(url, function(response){ /* Llenamos los arreglos con los datos del XML */ id[i] = response.data.items[0].id; titulos[i] = response.data.items[0].title; descripcion[i] = response.data.items[0].description; fecha[i] = response.data.items[0].updated; /*y creamos y mostramos la información en un html */ $('#videolista').append('<li style="cursor: pointer"><a class="fancybox_videos_lista" href="../cf/videos-fancybox.cfm" onclick="vidFancylista('+id[i]+');"><div style="float:left;"><div class="urlImg"><img class="idImg' + i + '" src="http://img.youtube.com/vi/' + id[i] + '/default.jpg" /></div><div class="infoVd" style="float:left;"><h2 class="">' + titulos[j] + '</h2><p class="">' + descripcion[i] + '</p></div></div></a></li>'); datosObt[i] = 'date:' + fecha[i] + '|' + 'id:' + id[i] + '|' + 'title:' + titulos[i] + '|' + 'description:' + descripcion[i]; //console.log(datosObt); var i=i+1; }); } }, // Se ejecuta si la solicitud encontró algún error error: function(xhr, textStatus, errorThrown) { alert("Un error ha ocurrido. Error 3" + errorThrown ); } }); vidFancylista(datosObt,id); }
Toda la información regresa de manera correcta, pero en un orden aleatorio. Si se dan cuenta utilizo un i + 1 dentro del segundo for, esto porque si utilizo j, siempre vale por el número total de elementos... no me pregunten porque :/
¿Saben de algún camino para poder mostrar la información o manejar la información en el orden que esta en la base de datos?
De antemano un saludo.