Buenas amig@s,
Ando aqui liado con dos tablas de una pagina web, a ver si me podeis ayudar, porque me estoy volviendo loco con javascript.
Tengo una tabla html con el aspecto siguiente:
<table>
<tr class="seleccionar" id="Juan">
<td>
Juan
</td>
<td>
23
</td>
</tr>
<tr class="seleccionar" id="Leo">
<td>
Leo
</td>
<td>
47
</td>
</tr>
Por otro lado tengo otra tabla idéntica (tambien con 2 columnas), pero sin filas todavia, en la que deberia ir agregando automaticamente la misma fila de la otra tabla cuando haga click sobre ella con el ratón, y borrarla de la primera.
De manera que si hago clic en todas las filas de la primera tabla, se borrarán de ésta, y aparecerán en la 2ª tabla.
En resumen, el objetivo es pasar todas las filas de la primera tabla a la segunda, haciendo clic sobre cada fila una a una.
Estoy probando con jquery, para eliminar la fila pero no me funciona y no se por qué:
<script type="text/javascript">
$(function(){
$(document).on("click",".seleccionar",function(){
$(this).remove();
});
});
</script>
Y para agregar la fila he pensado en usar el id, que tiene el nombre de las personas, para localizar los td. ¿Cómo podría hacerlo?
Gracias amigoss
Bueno a como creo entender quieres pasar los datos de una columna a otra, lo que se me ocurre es hacer algo asi:
$("#Juan td").click(function() {
var valor = $(this).text();
$("#Leo").append(
'<td>' + valor + '</td>'
);
$(this).remove();
});
Aunque bueno eso a como entendi ya que pues es lo que muestras de la tabla.
@s00rk lo que haces es modificar las celdas no las filas xD
Yo lo que haria seria esperar un evento sobre el tr de la primera tabla, y usaria appendTo() para mover el tr de una tabla a otra.
<table id="primera">
<tr>
<td>Juanjo</td>
<td>48</td>
<td>Paris</td>
</tr>
<tr>
<td>Fatima</td>
<td>50</td>
<td>Barcelona</td>
</tr>
</table>
<hr />
<table id="segunda"></table>
$(function () {
$(document).on('click','#primera tr',function(){
$(this).appendTo('#segunda');
});
});
Saludos