0

Quiero tomar los datos de una fila seleccionada de una tabla y que me mande los datos a otra tabla, pero quiero que una columna no se mande a la segunda tabla. ¿Cómo lo puedo hacer?

Este script lista los productos de una base de datos.

function listarVentas(){var nom = $("#caja").val();  
    $.get("CV",{"opc":1},function (data) {  
        
        var x = JSON.parse(data);  
        
          $("#tabla tbody tr").remove();     
        for(var i = 0;i<x.length;i++){  $("#tablaventas").append("<tr class='fila' ><td>"+(i+1)+"</td<td id='1'>"+x[i].idPro+"</td><td id='2'>"+x[i].nombre+"</td><td id='3'>"+x[i].precio+"</td><td>"+x[i].stock+"</td><td id='cantidad'><input name='' type='text'></td><td id='accion'><input name='' type='checkbox'></td></tr>");}  
    }); }     

Esta es mi tabla en la cual se lista los productos (tabla1)

<table class="table" id="tablaventas" class="tblas" style="visibility: hidden"><thead>  
                    <tr>  
                        <th scope="col">#</th>  
                        <th scope="col">ID</th>  
                        <th scope="col">PRODUCTO</th>  
                        <th scope="col">PRECIO</th>  
                        <th scope="col">STOCK</th>  
                        <th scope="col">CANTIDAD</th>  
                        <th scope="col">ACCION</th>  
                    </tr>  
                </thead>  
                <tbody>                   
                </tbody>  
            </table> 

Esta es la tabla en la cual quiero que la fila seleccionada de la tabla 1 envíe los datos, pero no quiero que envíe el dato de stock, sino que envíe el dato que se ingresa en el input.
(tabla 2)

 <table class="table" id="tablaprodus"  >  
                <thead>  
                    <tr>  
                        <th scope="col">#</th>  
                        <th scope="col">ID</th>  
                        <th scope="col">PRODUCTO</th>  
                        <th scope="col">PRECIO</th>  
                        <th scope="col">CANTIDAD</th>  
                        <th scope="col">ACCION</th>  
                    </tr>  
                </thead>  
                <tbody>                   
                </tbody>  
            </table>  
1
  • 1
    Te doy la bienvenida SOes y te invito a que des un vistazo al recorrido. Con referencia con tu pregunta trata de añadir mas información sobre tu problema como la estructura de tus dos tablas. Commented el 23 may. 2018 a las 16:08

2 respuestas 2

1

Mira, realmente es muy simple :

    (function($){
            $(function(){
                var trClone = $('#table1 tr:eq(1)').clone();
                trClone.find('td:eq(2)').remove();
                trClone.appendTo('#table2 tbody');
            });
        })(jQuery)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="table1" border="1">
        <thead>
            <tr>
                <th>header1</th>
                <th>header2</th>
                <th>header3</th>
                <th>header4</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>data1</td>
                <td>data2</td>
                <td>data3</td>
                <td>data4</td>
            </tr>
        </tbody>
    </table>
    <br>
    <table id="table2" border="1">

        <thead>
            <tr>
                <th>headerClone1</th>
                <th>headerClone2</th>
                <th>headerClone3</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>clone1</td>
                <td>clone2</td>
                <td>clone3</td>
            </tr>
        </tbody>
    </table>

Lo que se hace es clonar la tr que quieres, luego se remueve la columna con index x, y por ultimo se agrega esta tr clonada a la nueva tabla. la salida es:

Captura del resultado

1
  • Excelente aporte Nicolás!
    – cesabal
    Commented el 17 oct. 2020 a las 16:17
0

Te dejo el enlace al ejercicio de como enviar datos de una tabla a otra y te explico brevemente como funciona:

En la primer tabla tengo datos fijos que son los que utilizare para enviar la fila a otra tabla

<table id="tabla1" border="1" width="100%">
  <tr>
    <td>A1</td>
    <td>A2</td>
    <td>A3</td>
    <td><input type="button" value="Eviar" class="envio"></td>
  </tr>
  <tr>
    <td>B1</td>
    <td>B2</td>
    <td>B3</td>
    <td><input type="button" value="Eviar" class="envio"></td>
  </tr>
  <tr>
    <td>C1</td>
    <td>C2</td>
    <td>C3</td>
    <td><input type="button" value="Eviar" class="envio"></td>
  </tr>
</table>

La segunda tabla esta vacia:

<table id="tabla2" border="1" width="100%">
</table>

Dentro la la tabla1 hay un boton que servira para la interaccion con el usuario y asi podra pasar la fila a la tabla que esta vacia, para eso tenemos el siguiente codigo

$('.envio').on('click', function() {
    var hermano=$(this).parent();
    $("#tabla2").prepend("<tr>\
                                            <td>"+hermano.siblings("td:eq(0)").text()+"</td>\
                        <td>"+hermano.siblings("td:eq(1)").text()+"</td>\
                        <td>"+hermano.siblings("td:eq(2)").text()+"</td>\
                                        </tr>")
  });

Cuando se presione el boton lo que haremos sera regresar un nivel con la funcion parent() para ubicarnos al mismo nivel de los td, una vez ahí buscaremos a los hermanos de este td, por ejemplo A1,A2,A3 (para esto es la funcion siblings hermano.siblings("td:eq(1)")) con la opcion eq obtenemos cada uno de los elemento que queremos pasar a la tabla2 y obtenemos su texto con la funcion text().

Una vez que tenemos todos los datos la enviaremos a la tabla2 con la funcion $("#tabla2").prepend()

Te dejo el enlace para que veas como funciona https://jsfiddle.net/e8geuoez/

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.