• Publicidad

JavaScript para armado de tabla

Discute todo acerca de JavaScript así como DHTML o la tecnología AJAX.

JavaScript para armado de tabla

Notapor AgeValed » 2009-03-30 15:14 @676

Bueno espero que pueda llegarse a entender bien lo que quiero hacer y la verdad que estuve dando vuelta y se me complicó mucho hacerlo y no sé cómo...

Lo que quiero hacer es lo siguiente...

Tengo una tabla con N elementos, la cual tiene un ID fijo ya (que no tiene un orden especifico sino un valor que tengo que tener sí o sí) en la tabla necesito un checkbox, la cual tiene uno que puede seleccionar a todos, eso ya está hecho.

Cuando se pulsa en el checkbox se calcula un valor de una DB (ya está hecho) que depende si está uno, dos, o 10 seleccionados (para obtener ese valor se pasa el id).

Ahora el problema es el siguiente...

Lo que tengo que hacer es que cada vez que se pulsa en un checkbox ése pase automáticamente arriba, y que se pueda ordenar solo ésos, por los otros dos valores de la tabla; suponiendo que hay 10 seleccionados se pueda hacer con drag & drop moverlos para ordenarlos como uno quiera.

¿Se entiende más o menos lo que quiero hacer?

Cualquier cosa que quieran saber pregunten; mientras, seguiré investigando.

Pablo
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441

Publicidad

Notapor kidd » 2009-03-30 15:37 @692

Uriel Lizama Perl programmer fundador de Perl en Español
Perl Programming Language
Avatar de Usuario
kidd
Creador de Perl en Español
Creador de Perl en Español
 
Mensajes: 1166
Registrado: 2003-10-15 16:52 @744
Ubicación: México

Notapor AgeValed » 2009-03-30 15:48 @700

Para drag and drop ya lo tengo hecho (http://www.isocra.com/2008/02/table-dra ... ry-plugin/)

Ahora lo que tengo que hacer es...

Cuando haces clic en el chekbox suba arriba de la tabla.
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441

Notapor kidd » 2009-03-30 20:51 @911

Deja ver si entiendo.

Tu tienes unos campos, los cuales tienen una caja de selección.

Si la caja es seleccionada entonces el campo pasará a alguna otra parte en donde podrá ser ordenado junto con los otros campos que fueron seleccionados.

¿Esto es correcto?
Uriel Lizama Perl programmer fundador de Perl en Español
Perl Programming Language
Avatar de Usuario
kidd
Creador de Perl en Español
Creador de Perl en Español
 
Mensajes: 1166
Registrado: 2003-10-15 16:52 @744
Ubicación: México

Notapor AgeValed » 2009-03-31 07:33 @356

Es una sola tabla; cuando se selecciona una fila, esa fila se va arriba del todo, si se selecciona otra fila se va arriba de todas las no seleccionada y abajo de la seleccionada...

Eso sería, pero es todo en la misma tabla.

Si logro copiar todo el contenido de un tr a otro ¡ya estaría más o menos lo que quiero! :P
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441

Notapor elnico » 2009-03-31 19:39 @860

Hola.
Si estuvieras usando Jquery sería algo así.

Sintáxis: [ Descargar ] [ Ocultar ]
  1. <script type="text/javascript" src="jquery.js"></script> 
  2. <script> 
  3. function moverFila(obj){ 
  4. $(obj).parent().prepend('<tr onclick="moverFila(this)">'+$(obj).html()+'</tr>') 
  5. $(obj).remove() 
  6. </script> 
  7.  
  8. <table> 
  9.  
  10. <tr onclick="moverFila(this)"><td>Fila1</td></tr> 
  11. <tr onclick="moverFila(this)"><td>Fila2</td></tr> 
  12. <tr onclick="moverFila(this)"><td>Fila3</td></tr> 
  13. <tr onclick="moverFila(this)"><td>Fila4</td></tr> 
  14. <tr onclick="moverFila(this)"><td>Fila5</td></tr> 
  15.  
  16. </table> 


Espero que te sirva.
Saludos
elnico
Perlero nuevo
Perlero nuevo
 
Mensajes: 69
Registrado: 2007-09-09 14:44 @656

Notapor AgeValed » 2009-04-01 08:41 @403

elnico: mil gracias es 99% lo que necesitaba :D

Le modifiqué algo y quedó...
Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
function moverFila(obj,valor){
        if(document.getElementById("listach"+valor).checked == true){
                $(obj).parent().prepend('<tr id="tridlistas'+valor+'" onclick="moverFila(this,'+valor+')">'+$(obj).html()+'</tr>')
                $(obj).remove()
                document.getElementById("listach"+valor).checked = true;
        }
}
Coloreado en 0.001 segundos, usando GeSHi 1.0.8.4


Mil gracias :D:D:D

Agrego...

Si al deseleccionar el check box quiero que se vaya abajo de todo los que están seleccionados, ¿cómo lo haría? :oops: :oops:

:D :D


¡¡¡¡EDITO!!!!

Tengo varios problemas con esto, el principal es cuando utilizo "Tablesorter: Ordenar tabla con jQuery" ¡me agrega los que moví! de nuevo a la tabla (o sea, que quedan algunos 2 veces) y rompe todo :(
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441

Notapor elnico » 2009-04-02 12:49 @575

Hola,

No conocía este plugin pero siempre es bueno investigar un poco.
La solución es disparar el evento de actualización para refrescar la cache del objeto y se hace así:

Sintáxis: [ Descargar ] [ Ocultar ]
Using javascript Syntax Highlighting
//Agrega este código al final de la función moverFila()
$("#idDetuTabla").trigger("update");

La funcion completa es:

function moverFila(obj){
  $(obj).parent().prepend('<tr onclick="moverFila(this)">'+$(obj).html()+'</tr>')
  $(obj).remove();
  $("#myTable").trigger("update");
}
Coloreado en 0.000 segundos, usando GeSHi 1.0.8.4


Saludos.
elnico
Perlero nuevo
Perlero nuevo
 
Mensajes: 69
Registrado: 2007-09-09 14:44 @656

Notapor AgeValed » 2009-04-03 07:37 @359

Grande. Ahí funcionó todo y le agregué para el drag and drop también :D Ahora funciona todo joya :D
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441

Notapor AgeValed » 2009-04-21 09:03 @419

¿Cómo sería si el OBJ lo quiero mover arriba de un tr con id 'x' en vez de arriba de la tabla?

Gracias :)
AgeValed
Perlero nuevo
Perlero nuevo
 
Mensajes: 33
Registrado: 2008-09-19 09:35 @441


Volver a JavaScript

¿Quién está conectado?

Usuarios navegando por este Foro: No hay usuarios registrados visitando el Foro y 0 invitados