Foros del Web - Ver Mensaje Individual

Dany_s · #5 (**permalink**) 01/04/2011, 07:47

algo asi, si agregas mas campos a la tabla debe funcionar sin modificar nada

Código HTML:

Ver original<html>
    <head>
        <title>Ejemplo</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
        <script>
 
        $(function(){
            fila = $("#articulos tbody").html();
            $("#agregarArticulo").click(function(){
                $("#articulos tbody").append( fila );
            });
 
            $('.borrarArticulo').live('click', function(){
                $(this).closest('tr').remove();
            });
 
            $('#compras').submit( function(){
                alert ($(this).serialize());
                return false;
            });
        });
 
        </script>
    </head>
    <body>
 
    <form id="compras">
        <table id="articulos">
            <thead>
                <tr>
                    <th>Cantidad</th>
                    <th>Código</th>
                    <th>Descripción</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><input type="text" size="3" name="cantidad[]"></td>
                    <td><input type="text" size="5" name="codigo[]"></td>
                    <td><input type="text" size="10" name="descripcion[]"></td>
                    <td><a href="#" class="borrarArticulo">Borrar</a></td>
                </tr>
            </tbody>
            <tfoot>
                <tr>
                    <td><a href="#" id="agregarArticulo">Agregar articulo</a></td>
                </tr>
            </tfoot>
        </table>
        <input id="submit" type="submit" value="Enviar">
    </form>
    </body>
</html>