Foros del Web » Programando para Internet » Javascript »

Mostrar los ultimos objetos de un Array

 Estas en el tema de Mostrar los ultimos objetos de un Array en el foro de Javascript en Foros del Web. Hola, tengo un array con una serie de nombres y una búsqueda y me he creado los botones para moverme por los resultados de dicha ...
  #1 (permalink)  
Antiguo 06/11/2013, 04:05
 
Fecha de Ingreso: mayo-2013
Mensajes: 38
Antigüedad: 11 años
Puntos: 0
Mostrar los ultimos objetos de un Array
Hola, tengo un array con una serie de nombres y una búsqueda y me he creado los botones para moverme por los resultados de dicha búsqueda y todos funcionan correctamente menos el que va directamente al último.
Me he creado una variable para controlar el numero de objetos que me muestra por página, entonces necesito un botón que me lleve directamente a la última página y esta puede tener la misma cantidad de objetos que el resto o puede tener menos, así que me he creado la siguiente variable para el susodicho botón Ir ultimo
var ultimo = (encontrados.length / limite_resultados); así pues si el resultado tiene decimales me hace una cosa y si no pues me hace otra, sin este botón todos los demás funcionan correctamente, pero con el botón de último el de Ir atrás deja de funcionar correctamente, haber si me podeis echar una mano

Código Javascript: 
Ver original
  1. var limite_resultados = 4;
  2.  
  3. var ultimo= 0;
  4. var pagtotal = 0;
  5. var pagactual = 0;
  6. var mostrados = 0;
  7.  
  8. var encontrados=new Array();
  9. var buscarNombre = new Array();
  10. buscarNombre = [["Daniel_1",35],
  11.                 ["Luis_2",42],
  12.                 ["María_3",19],
  13.                 ["Damian_4",51],
  14.                 ["Dario_5",99],
  15.                 ["María_6",21],
  16.                 ["David_7",28],
  17.                 ["Manuel_8",28],
  18.                 ["Mario_9",26]];
  19.  
  20. function calcularTotalPaginas(cantidad){
  21.         var contador = 0;
  22.         do{
  23.             cantidad = parseInt(cantidad) - parseInt(limite_resultados);
  24.             contador++;
  25.         }
  26.         while(cantidad > 0)
  27.         return contador;
  28.     }
  29.  
  30. function irUltimo(){
  31.     document.getElementById('datos').innerHTML = "";
  32.     var mostrados = 0;
  33.     var ultimo = (encontrados.length / limite_resultados);
  34.     //Si tiene decimales me hace esto   
  35.     if (ultimo == parseInt(ultimo)) {       
  36.         var multiply = (encontrados.length - limite_resultados);
  37.         ultimo = multiply;
  38.          for (i = 0; i < limite_resultados; i++){
  39.              if(ultimo < encontrados.length){               
  40.                  document.getElementById('datos').innerHTML += encontrados[ultimo][0] +" ... "+ encontrados[ultimo][1] + "<br>";                
  41.                  ultimo ++;
  42.                  mostrados ++;
  43.             }
  44.         }
  45.     }               
  46.     // Y si tiene decimales me hace esto otro           
  47.     if (ultimo == parseFloat(ultimo)) {     
  48.         var multiply = (encontrados.length / limite_resultados);                                
  49.         ultimo = Math.ceil(encontrados.length - multiply);              
  50.         mostrados = 0;              
  51.         for (i = 0; i < limite_resultados; i++){
  52.                 if(ultimo < encontrados.length){                
  53.                     document.getElementById('datos').innerHTML += encontrados[ultimo][0] +" ... "+ encontrados[ultimo][1] + "<br>";                 
  54.                     ultimo ++;
  55.                     mostrados ++;                   
  56.                 }
  57.             }
  58.         }   
  59.             
  60.     pagactual = Math.ceil(encontrados.length / limite_resultados);
  61.     var divpags = document.getElementById("pagina");
  62.     divpags.innerHTML = "mostrando página: " + pagactual + "/" + pagtotal;
  63.     
  64.     if(pagactual == pagtotal) {
  65.             document.getElementById("botprimero").disabled=false;
  66.             document.getElementById("botanterior").disabled=false;
  67.             document.getElementById("botsiguiente").disabled=true;
  68.             document.getElementById("botultimo").disabled=true;
  69.     }else{
  70.             document.getElementById("botprimero").disabled=false;
  71.             document.getElementById("botanterior").disabled=false;
  72.             document.getElementById("botsiguiente").disabled=false;
  73.             document.getElementById("botultimo").disabled=false;    
  74.     }   
  75. }
  76.     
  77. function irSiguiente(){
  78.     document.getElementById('datos').innerHTML = "";        
  79.     mostrados = 0;  
  80.     if(ultimo < encontrados.length){
  81.         for (i = 0; i < limite_resultados; i++){
  82.             if(ultimo < encontrados.length){
  83.                     document.getElementById('datos').innerHTML+= encontrados[ultimo][0] +" ... "+ encontrados[ultimo][1] + "<br>";
  84.             ultimo ++;
  85.                 mostrados ++;
  86.             }
  87.         }
  88.     }   
  89.     pagactual ++;
  90.     var divpags = document.getElementById("pagina");
  91.     divpags.innerHTML = "mostrando página: " + pagactual + "/" + pagtotal;
  92.     
  93.     if(pagactual == pagtotal) {
  94.             document.getElementById("botprimero").disabled=false;
  95.             document.getElementById("botanterior").disabled=false;
  96.             document.getElementById("botsiguiente").disabled=true;
  97.             document.getElementById("botultimo").disabled=true;
  98.     }else{
  99.             document.getElementById("botprimero").disabled=false;
  100.             document.getElementById("botanterior").disabled=false;
  101.             document.getElementById("botsiguiente").disabled=false;
  102.             document.getElementById("botultimo").disabled=false;    
  103.     }   
  104. }   
  105.  
  106. function irPrimero(){
  107.     document.getElementById('datos').innerHTML = "";
  108.     ultimo = 0 ;
  109.     for (i = 0; i < limite_resultados; i++){        
  110.             document.getElementById('datos').innerHTML += encontrados[ultimo][0] +" ... "+ encontrados[ultimo][1] + "<br>";         
  111.             ultimo ++;          
  112.     }
  113.     
  114.     pagactual = 1;
  115.     var divpags = document.getElementById("pagina");
  116.     divpags.innerHTML = "mostrando página: " + pagactual + "/" + pagtotal;
  117.     
  118.     if(pagactual == 1) {
  119.             document.getElementById("botprimero").disabled=true;
  120.             document.getElementById("botanterior").disabled=true;
  121.             document.getElementById("botsiguiente").disabled=false;
  122.             document.getElementById("botultimo").disabled=false;    
  123.     }else{
  124.             document.getElementById("botprimero").disabled=false;
  125.             document.getElementById("botanterior").disabled=false;
  126.             document.getElementById("botsiguiente").disabled=false;
  127.             document.getElementById("botultimo").disabled=false;    
  128.     }
  129. }
  130.  
  131. function irAnterior(){
  132.     document.getElementById('datos').innerHTML = "";
  133.     ultimo = (ultimo - mostrados - limite_resultados) ;
  134.     for (i = 0; i < limite_resultados; i++){
  135.         if(ultimo < encontrados.length){                    document.getElementById('datos').innerHTML += encontrados[ultimo][0]+" ... "+ encontrados[ultimo][1] + "<br>";          
  136.             ultimo ++;
  137.             mostrados = +limite_resultados;     
  138.         }
  139.     }
  140.  
  141.     pagactual --;
  142.     var divpags = document.getElementById("pagina");
  143.     divpags.innerHTML = "mostrando página: " + pagactual + "/" + pagtotal;
  144.     
  145.     if(pagactual == 1) {
  146.             document.getElementById("botprimero").disabled=true;
  147.             document.getElementById("botanterior").disabled=true;
  148.             document.getElementById("botsiguiente").disabled=false;
  149.             document.getElementById("botultimo").disabled=false;    
  150.     }else{
  151.             document.getElementById("botprimero").disabled=false;
  152.             document.getElementById("botanterior").disabled=false;
  153.             document.getElementById("botsiguiente").disabled=false;
  154.             document.getElementById("botultimo").disabled=false;    
  155.     }
  156. }
Última edición por josemar2000; 06/11/2013 a las 04:39
  #2 (permalink)  
Antiguo 06/11/2013, 06:31
Avatar de marlanga  
Fecha de Ingreso: enero-2011
Ubicación: Murcia
Mensajes: 1.024
Antigüedad: 13 años, 3 meses
Puntos: 206
Respuesta: Mostrar los ultimos objetos de un Array
Menudo cacao de código para conseguir algo muy sencillo.

http://jsfiddle.net/fYcJb/
  #3 (permalink)  
Antiguo 06/11/2013, 13:29
 
Fecha de Ingreso: mayo-2013
Mensajes: 38
Antigüedad: 11 años
Puntos: 0
Respuesta: Mostrar los ultimos objetos de un Array
Hola, y no me digas eso sobre el código que me deprimes, la verdad es que tu código es mucho más limpio, pero tiene un pequeño problema, que yo con el mío no he conseguido solucionarlo, los botones de siguiente y último funcionan bien si la última pagina no está completa, o sea en el ejemplo si en la variable limite_resultados le pones 4 habría 2 páginas de 4 objetos y una 3ª dónde se mostraría uno sólo pues en este caso lo hace bien, pero si le pones 3 en ese caso cuando llegas a la 3 que sería la última y estaría completa ya no lo hace bien, los botones de siguiente y último siguen activos y al pulsar sobre ellos te llevan a una cuarta que está vacía.
Y el otro tema es que es un array de búsquedas, lo he comentado en el mensaje anterior, aunque sólo puse el código referente a los botones.
Aquí te paso el resto del código, que es el referente a las búsquedas.

Saludos

Código Javascript: 
Ver original
  1. function busca(valorBusqueda){
  2.     ultimo = 0;
  3.     encontrados = new Array();
  4.     for(var i=0; i < buscarNombre.length; i++){
  5.         var nodoLower = buscarNombre[i][0].toLowerCase();
  6.         if(nodoLower.indexOf(valorBusqueda.toLowerCase()) != -1) {
  7.             encontrados.push(buscarNombre[i]);
  8.         }
  9.     }
  10.     document.getElementById("datos");   
  11.     var divcant = document.getElementById("cantidad");
  12.     var divpags = document.getElementById("pagina");
  13.     
  14.     if(encontrados.length == 1){        
  15.         var cantidad = encontrados.length + " encontrado";          
  16.         document.getElementById("datos").innerHTML = encontrados[0][0] +" ... "+ encontrados[0][1] + "<br>";                
  17.         document.getElementById("botsiguiente").disabled=true;        
  18.         }else if(encontrados.length > 1) {      
  19.          var cantidad = encontrados.length + " encontrados";
  20.          document.getElementById("datos").innerHTML = "";       
  21.         var datos = "";
  22.         for (i = 0; i < limite_resultados; i++){        
  23.             document.getElementById("datos").innerHTML += encontrados[i][0] +" ... "+ encontrados[i][1] + "<br>";            
  24.             ultimo ++;
  25.         }
  26.         }else{
  27.             var cantidad = "No se han encontrado resultados";       
  28.             document.getElementById("datos").innerHTML = "";
  29.             divpags = "";
  30.             document.getElementById("pagina").innerHTML = "";                               
  31.     }   
  32.                
  33.     
  34.         divcant.innerHTML = cantidad;

Código HTML: 
Ver original
  1. <form id="frm" name="frm">
  2.     Buscar nombre:
  3.     <input name="text1" type="text" id="valorBusqueda" size="30" maxlength="25" value="Ingresar texto de búsqueda" onFocus="limpiarTexto()" onBlur="mostrarTexto()" />
  4.     &nbsp;
  5.     <button type="button" id="botbuscar" value="Buscar" onMouseDown="busca('valorBusqueda').value)"><strong>Buscar</strong> &nbsp;</button>
  6. </form>
  #4 (permalink)  
Antiguo 06/11/2013, 15:49
Avatar de marlanga  
Fecha de Ingreso: enero-2011
Ubicación: Murcia
Mensajes: 1.024
Antigüedad: 13 años, 3 meses
Puntos: 206
Respuesta: Mostrar los ultimos objetos de un Array
Me equivoqué, debí usar ceil en vez de floor. La búsqueda es aún más fácil. Yo creí que el problema lo tenías al paginar; buscar cadenas en arrays es una simpleza. Como veo que insistes también lo meto.

http://jsfiddle.net/fYcJb/3/
  #5 (permalink)  
Antiguo 06/11/2013, 18:18
 
Fecha de Ingreso: mayo-2013
Mensajes: 38
Antigüedad: 11 años
Puntos: 0
Respuesta: Mostrar los ultimos objetos de un Array
Ahora funciona perfectamente, pero el código está tan limpio que ahora como hago para incluir el formato, estilo y demás. Aquí te pongo un ejemplo de como lo tenía con el otro código:

Código Javascript: 
Ver original
  1. document.getElementById("lNombres").innerHTML += "<div class=amigos><div class=columnaIzqda> \
  2.     <img src=imagesInfor/" + array[i][1] + ".jpg</div> \
  3.     <div class=columnaDerecha> \
  4.     <div class=cabecera> \
  5.     <div class=nombres>" + array[i][0] + "</div> \  
  6.     <div class=url><a href=" + array[i][4] + ".html</a></div> \     
  7.     </div></div></div>";
  #6 (permalink)  
Antiguo 07/11/2013, 04:47
Avatar de marlanga  
Fecha de Ingreso: enero-2011
Ubicación: Murcia
Mensajes: 1.024
Antigüedad: 13 años, 3 meses
Puntos: 206
Respuesta: Mostrar los ultimos objetos de un Array
Cambiar la forma de dibujar los resultados es muy sencillo. Gasta tiempo en estudiar el código.
  #7 (permalink)  
Antiguo 07/11/2013, 14:15
 
Fecha de Ingreso: mayo-2013
Mensajes: 38
Antigüedad: 11 años
Puntos: 0
Respuesta: Mostrar los ultimos objetos de un Array
Ya he metido el diseño, he modificado esta línea, res.push(buscarNombre[ini][0]+" .... "+buscarNombre[ini][1]); sustituyendo estos datos por los míos y con mi diseño.

La verdad es que era fácil, más simple que en el mío, pero entre lo agobiado que estoy y que el JavaScript a este nivel es algo nuevo para mí, estoy aprendiendo y la edad que tampoco ayuda me está costando.

Dicho esto y apelando a tu paciencia, necesito que me ayudes en dos cuestiones, y ya no te molesto más, quiero poner un botón que haga que cuando haya realizado una búsqueda, al pulsar en él, desaparezcan los resultados de la búsqueda y me aparezcan de nuevo todos los objetos, o sea, como si recargaras la página, yo te he adelantado algo de trabajo.
Echale un vistazo
http://jsfiddle.net/josemar2000/fYcJb/4/

Y el otro tema, es el probema de los acentos, necesito que al escribir en el input no distinga entre los caracteres acentuados y los que no, lo mismo que hace con las mayúsculas, pues esto es todo
Saludos y gracias
  #8 (permalink)  
Antiguo 08/11/2013, 06:53
Avatar de marlanga  
Fecha de Ingreso: enero-2011
Ubicación: Murcia
Mensajes: 1.024
Antigüedad: 13 años, 3 meses
Puntos: 206
Respuesta: Mostrar los ultimos objetos de un Array
Mostrar todos los resultados solo es copiar el array donte están todos los items en el array donde se almacenan los items flitrados.

En cuanto a la búsqueda por acentos, tendrás que crear una función nueva que acepte una cadena, y que devuelva una copia de esa cadena en minúsculas y sin acentos. Luego el filtro compararía los nombres, como ahora, pero usando esa función en cada nombre.
  #9 (permalink)  
Antiguo 10/11/2013, 12:35
 
Fecha de Ingreso: mayo-2013
Mensajes: 38
Antigüedad: 11 años
Puntos: 0
Respuesta: Mostrar los ultimos objetos de un Array
He hecho esta función, ¿qué te parece?, supongo que necesitará algún ajuste, he incluido la ñ además de los acentos

Código Javascript: 
Ver original
  1. function reemplazaAcentos(cadena){  
  2.     var cadena = txtBuscar.value.toLowerCase();
  3.     var cadena_acentos = "áéíóúñü";
  4.     var cadena_reemplaza = "aeiounu";
  5.     for(var i=0; i<cadena_acentos.length; i++ ){
  6.         cadena = cadena.replace(cadena_acentos[i],cadena_reemplaza[i]);
  7.     }
  8.     return cadena;
  9. }

Etiquetas: funcion, html, objetos, variable
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta


« Tema Anterior | Próximo Tema »


La zona horaria es GMT -6. Ahora son las 20:58.