Foros del Web » Programando para Internet » Javascript »

Ordenación inversa

Estas en el tema de Ordenación inversa en el foro de Javascript en Foros del Web. Tengo este javasCrip que sirve para que pulsando en la cabecera de cada columna de mi tabla-web, se me reordenen los datos segun cada columna. ...
  #1 (permalink)  
Antiguo 05/02/2003, 06:14
Avatar de ferent  
Fecha de Ingreso: junio-2002
Ubicación: Madrid
Mensajes: 633
Antigüedad: 21 años, 10 meses
Puntos: 0
Ordenación inversa

Tengo este javasCrip que sirve para que pulsando en la cabecera de cada columna de mi tabla-web, se me reordenen los datos segun cada columna.

El problema es que me lo ordena de menor a mayor y yo busco hacerlo al reves,de mayor a menor o de la Z a la A ¿alguien sabe qué hay que cambiar para que haga esto?

Ahí va el código:
Código PHP:
<SCRIPT LANGUAGE="JavaScript">

<!-- 
Begin
function setDataType(cValue)
  {
    
// THIS FUNCTION CONVERTS DATES AND NUMBERS FOR PROPER ARRAY
    // SORTING WHEN IN THE SORT FUNCTION
    
var isDate = new Date(cValue);
    if (
isDate == "NaN")
      {
        if (
isNaN(cValue))
          {
            
// THE VALUE IS A STRING, MAKE ALL CHARACTERS IN
            // STRING UPPER CASE TO ASSURE PROPER A-Z SORT
            
cValue cValue.toUpperCase();
            return 
cValue;
          }
        else
          {
            
// VALUE IS A NUMBER, TO PREVENT STRING SORTING OF A NUMBER
            // ADD AN ADDITIONAL DIGIT THAT IS THE + TO THE LENGTH OF
            // THE NUMBER WHEN IT IS A STRING
            
var myNum;
            
myNum String.fromCharCode(48 cValue.length) + cValue;
            return 
myNum;
          }
        }
  else
      {
        
// VALUE TO SORT IS A DATE, REMOVE ALL OF THE PUNCTUATION AND
        // AND RETURN THE STRING NUMBER
        //BUG - STRING AND NOT NUMERICAL SORT .....
        // ( 1 - 10 - 11 - 2 - 3 - 4 - 41 - 5  etc.)
        
var myDate = new String();
        
myDate isDate.getFullYear() + " " ;
        
myDate myDate isDate.getMonth() + " ";
        
myDate myDate isDate.getDate(); + " ";
        
myDate myDate isDate.getHours(); + " ";
        
myDate myDate isDate.getMinutes(); + " ";
        
myDate myDate isDate.getSeconds();
        
//myDate = String.fromCharCode(48 + myDate.length) + myDate;
        
return myDate ;
      }
  }
function 
sortTable(coltableToSort)
  {
    var 
iCurCell col tableToSort.cols;
    var 
totalRows tableToSort.rows.length;
    var 
bSort 0;
    var 
colArray = new Array();
    var 
oldIndex = new Array();
    var 
indexArray = new Array();
    var 
bArray = new Array();
    var 
newRow;
    var 
newCell;
    var 
i;
    var 
c;
    var 
j;
    
// ** POPULATE THE ARRAY colArray WITH CONTENTS OF THE COLUMN SELECTED
    
for (i=1tableToSort.rows.lengthi++)
      {
        
colArray[1] = setDataType(tableToSort.cells(iCurCell).innerText);
        
iCurCell iCurCell tableToSort.cols;
      }
    
// ** COPY ARRAY FOR COMPARISON AFTER SORT
    
for (i=0colArray.lengthi++)
      {
        
bArray[i] = colArray[i];
      }
    
// ** SORT THE COLUMN ITEMS
    //alert ( colArray );
    
colArray.sort();
    
//alert ( colArray );
    
for (i=0colArray.lengthi++)
      { 
// LOOP THROUGH THE NEW SORTED ARRAY
        
indexArray[i] = (i+1);
        for(
j=0bArray.lengthj++)
          { 
// LOOP THROUGH THE OLD ARRAY
            
if (colArray[i] == bArray[j])
              {  
// WHEN THE ITEM IN THE OLD AND NEW MATCH, PLACE THE
                // CURRENT ROW NUMBER IN THE PROPER POSITION IN THE
                // NEW ORDER ARRAY SO ROWS CAN BE MOVED ....
                // MAKE SURE CURRENT ROW NUMBER IS NOT ALREADY IN THE
                // NEW ORDER ARRAY
                
for (c=0c<ic++)
                  {
                    if ( 
oldIndex[c] == (j+1) )
                    {
                      
bSort 1;
                    }
                      }
                      if (
bSort == 0)
                        {
                          
oldIndex[i] = (j+1);
                        }
                          
bSort 0;
                        }
          }
    }
  
// ** SORTING COMPLETE, ADD NEW ROWS TO BASE OF TABLE ....
  
for (i=0i<oldIndex.lengthi++)
    {
      
newRow tableToSort.insertRow();
      for (
c=0c<tableToSort.colsc++)
        {
          
newCell newRow.insertCell();
          
newCell.innerHTML tableToSort.rows(oldIndex[i]).cells(c).innerHTML;
        }
      }
  
//MOVE NEW ROWS TO TOP OF TABLE ....
  
for (i=1i<totalRowsi++)
    {
      
tableToSort.moveRow((tableToSort.rows.length -1),1);
    }
  
//DELETE THE OLD ROWS FROM THE BOTTOM OF THE TABLE ....
  
for (i=1i<totalRowsi++)
    {
      
tableToSort.deleteRow();
    }
  }
//  End -->
</script> 
Gracias
__________________
Culto es aquel que sabe donde encontrar lo que no sabe.
  #2 (permalink)  
Antiguo 05/02/2003, 08:59
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 4 meses
Puntos: 38
Re: Ordenación inversa

Hola ferent.

El sort propiamente dicho ocurre en la siguiente línea:

Código:
colArray.sort();
Esa función sort puede recibir como parámetro una función que compare cada par de valores y es usando esa opción como puedes obtener un sort inverso.

Prueba haciendo lo siguiente:

Código:
colArray.sort(compare);
...e incluye la siguiente función:

Código:
function compare(sVal1, sVal2){
 if (sVal1 < sVal2) return -1;
 if (sVal1 > sVal2) return 1;
 return 0;
}
Avísame por favor si funciona o no.

Saludos.
  #3 (permalink)  
Antiguo 05/02/2003, 10:07
Avatar de ferent  
Fecha de Ingreso: junio-2002
Ubicación: Madrid
Mensajes: 633
Antigüedad: 21 años, 10 meses
Puntos: 0
Hola Kaopectate;

He probado lo que me has dicho y no se ha realizado ningún cambio, como no ando muy rodado de JavasCript, te digo lo que hice, por si acaso no está bien:

Incluí la funcion de "compare al principio del javascript que puse antes, quedando del siguiente modo:
Código PHP:
<SCRIPT LANGUAGE="JavaScript">

<!-- 
Begin
function compare(sVal1sVal2){
 if (
sVal1 sVal2) return -1;
 if (
sVal1 sVal2) return 1;
 return 
0;
}
function 
setDataType(cValue)
  {
    
// THIS FUNCTION CONVERTS DATES AND NUMBERS FOR PROPER ARRAY
    // SORTING WHEN IN THE SORT FUNCTION
    
var isDate = new Date(cValue);
    if (
isDate == "NaN")
      {
        if (
isNaN(cValue))
          { 
etcetc... 
y por supuesto puse el nombre de la función donde me dijiste, y todo sigue igual que antes .
__________________
Culto es aquel que sabe donde encontrar lo que no sabe.
  #4 (permalink)  
Antiguo 05/02/2003, 10:12
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 4 meses
Puntos: 38
Está bién. Haz la siguiente prueba:

function compare(sVal1, sVal2){
if (sVal1 < sVal2) return 1;
if (sVal1 > sVal2) return -1;
return 0;
}

Creo que es eso lo que falta.

Saludos.
  #5 (permalink)  
Antiguo 05/02/2003, 10:21
Avatar de ferent  
Fecha de Ingreso: junio-2002
Ubicación: Madrid
Mensajes: 633
Antigüedad: 21 años, 10 meses
Puntos: 0
Lo conseguí!!!

Bueno, lo conseguiste

Era como tú decias pero al revés, osea, así:

Código PHP:
function compare(sVal1sVal2){
//el menos del uno era abajo y no arriba
 
if (sVal1 sVal2) return 1;
 if (
sVal1 sVal2) return -1;
 return 
0;

Muchiiiisimas gracias
__________________
Culto es aquel que sabe donde encontrar lo que no sabe.
  #6 (permalink)  
Antiguo 05/02/2003, 10:37
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 4 meses
Puntos: 38
De cualquier modo todos ganamos un script muy interesante.

Saludos compadre.
  #7 (permalink)  
Antiguo 05/02/2003, 11:28
Avatar de ferent  
Fecha de Ingreso: junio-2002
Ubicación: Madrid
Mensajes: 633
Antigüedad: 21 años, 10 meses
Puntos: 0
Ya que veo que me has puestos las estrellas del honor escribo el resto del código para poder llamar al javasCript, para los que no saben mucho de Script(como yo )

Pues en la tabla en donde se deben ordenar por columnas han de poner esto:

Código PHP:
//indicar el número de columnas, teniendo cuidado de que no haya colspan
<table name="rsTable" id="rsTable" cols=6>
//hacer la llamada al javascript del siguiente modo
<td><A href="javascript:sortTable(0, rsTable">ID</A></td>
    <
td><A href="javascript:sortTable(1, rsTable);">Nombre</A></td>
    <
td><A href="javascript:sortTable(2, rsTable);">Apellidos</A></td>

//etc...
//Y lo demás depende de ustedes. 
Un placer
__________________
Culto es aquel que sabe donde encontrar lo que no sabe.
  #8 (permalink)  
Antiguo 05/02/2003, 11:49
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 4 meses
Puntos: 38
Oye ferent, ¿Por que no armas un ejemplo con el sort en orden normal para ponerlo en los FAQs?

Lo único que te pediría es que trataras de respetar el formato visual (que es muy sencillo).

Saludos.
  #9 (permalink)  
Antiguo 05/02/2003, 12:26
Avatar de ferent  
Fecha de Ingreso: junio-2002
Ubicación: Madrid
Mensajes: 633
Antigüedad: 21 años, 10 meses
Puntos: 0
No soy muy bueno en redacción, por lo que te doy libertad para que cambies lo que desees al respecto.

100 - Ordenar campos de una tabla segun columna

P. ¿Cómo puedo ordenar los datos de una tabla dependiendo de cada columna?
R. Muy sencillo, consta de dos pasos.

1º Añade este Script en el head
Código PHP:
<SCRIPT LANGUAGE="JavaScript">

<!-- 
Begin
function compare(sVal1sVal2){
//para cambiar el orden (ascendente o descendente) se debe 
//cambiar a negativo el primer 1 y a positivo el segundo, segun convenga
 
if (sVal1 sVal2) return 1;
 if (
sVal1 sVal2) return -1;
 return 
0;
}
function 
setDataType(cValue)
  {
    
// THIS FUNCTION CONVERTS DATES AND NUMBERS FOR PROPER ARRAY
    // SORTING WHEN IN THE SORT FUNCTION
    
var isDate = new Date(cValue);
    if (
isDate == "NaN")
      {
        if (
isNaN(cValue))
          {
            
// THE VALUE IS A STRING, MAKE ALL CHARACTERS IN
            // STRING UPPER CASE TO ASSURE PROPER A-Z SORT
            
cValue cValue.toUpperCase();
            return 
cValue;
          }
        else
          {
            
// VALUE IS A NUMBER, TO PREVENT STRING SORTING OF A NUMBER
            // ADD AN ADDITIONAL DIGIT THAT IS THE + TO THE LENGTH OF
            // THE NUMBER WHEN IT IS A STRING
            
var myNum;
            
myNum String.fromCharCode(48 cValue.length) + cValue;
            return 
myNum;
          }
        }
  else
      {
        
// VALUE TO SORT IS A DATE, REMOVE ALL OF THE PUNCTUATION AND
        // AND RETURN THE STRING NUMBER
        //BUG - STRING AND NOT NUMERICAL SORT .....
        // ( 1 - 10 - 11 - 2 - 3 - 4 - 41 - 5  etc.)
        
var myDate = new String();
        
myDate isDate.getFullYear() + " " ;
        
myDate myDate isDate.getMonth() + " ";
        
myDate myDate isDate.getDate(); + " ";
        
myDate myDate isDate.getHours(); + " ";
        
myDate myDate isDate.getMinutes(); + " ";
        
myDate myDate isDate.getSeconds();
        
//myDate = String.fromCharCode(48 + myDate.length) + myDate;
        
return myDate ;
      }
  }
function 
sortTable(coltableToSort)
  {
    var 
iCurCell col tableToSort.cols;
    var 
totalRows tableToSort.rows.length;
    var 
bSort 0;
    var 
colArray = new Array();
    var 
oldIndex = new Array();
    var 
indexArray = new Array();
    var 
bArray = new Array();
    var 
newRow;
    var 
newCell;
    var 
i;
    var 
c;
    var 
j;
    
// ** POPULATE THE ARRAY colArray WITH CONTENTS OF THE COLUMN SELECTED
    
for (i=1tableToSort.rows.lengthi++)
      {
        
colArray[1] = setDataType(tableToSort.cells(iCurCell).innerText);
        
iCurCell iCurCell tableToSort.cols;
      }
    
// ** COPY ARRAY FOR COMPARISON AFTER SORT
    
for (i=0colArray.lengthi++)
      {
        
bArray[i] = colArray[i];
      }
    
// ** SORT THE COLUMN ITEMS
    //alert ( colArray );
    
colArray.sort(compare);
    
//alert ( colArray );
    
for (i=0colArray.lengthi++)
      { 
// LOOP THROUGH THE NEW SORTED ARRAY
        
indexArray[i] = (i+1);
        for(
j=0bArray.lengthj++)
          { 
// LOOP THROUGH THE OLD ARRAY
            
if (colArray[i] == bArray[j])
              {  
// WHEN THE ITEM IN THE OLD AND NEW MATCH, PLACE THE
                // CURRENT ROW NUMBER IN THE PROPER POSITION IN THE
                // NEW ORDER ARRAY SO ROWS CAN BE MOVED ....
                // MAKE SURE CURRENT ROW NUMBER IS NOT ALREADY IN THE
                // NEW ORDER ARRAY
                
for (c=0c<ic++)
                  {
                    if ( 
oldIndex[c] == (j+1) )
                    {
                      
bSort 1;
                    }
                      }
                      if (
bSort == 0)
                        {
                          
oldIndex[i] = (j+1);
                        }
                          
bSort 0;
                        }
          }
    }
  
// ** SORTING COMPLETE, ADD NEW ROWS TO BASE OF TABLE ....
  
for (i=0i<oldIndex.lengthi++)
    {
      
newRow tableToSort.insertRow();
      for (
c=0c<tableToSort.colsc++)
        {
          
newCell newRow.insertCell();
          
newCell.innerHTML tableToSort.rows(oldIndex[i]).cells(c).innerHTML;
        }
      }
  
//MOVE NEW ROWS TO TOP OF TABLE ....
  
for (i=1i<totalRowsi++)
    {
      
tableToSort.moveRow((tableToSort.rows.length -1),1);
    }
  
//DELETE THE OLD ROWS FROM THE BOTTOM OF THE TABLE ....
  
for (i=1i<totalRowsi++)
    {
      
tableToSort.deleteRow();
    }
  }
//  End -->
</script> 
2º Paso: Crear la tabla

Código PHP:
//indicar el número de columnas, teniendo cuidado de que no haya colspan
<table name="rsTable" id="rsTable" cols=6>
<
tr><td><A href="java script:sortTable(0, rsTable">ID</A></td>
    <
td><A href="java script:sortTable(1, rsTable);">Nombre</A></td>
    <
td><A href="java script:sortTable(2, rsTable);">Apellidos</A></td>

//etc...
//Y lo demás depende de ustedes. 
__________________
Culto es aquel que sabe donde encontrar lo que no sabe.
  #10 (permalink)  
Antiguo 05/02/2003, 13:56
Avatar de Kaopectate
Colaborador
 
Fecha de Ingreso: diciembre-2001
Ubicación: Curaçao (Antillas Holandesas)
Mensajes: 3.179
Antigüedad: 22 años, 4 meses
Puntos: 38
Me parece perfecto ferent, aunque la idea es que lo pongas tu en los FAQs.

Gracias por el aporte compadre.
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 08:00.