JSFiddle - React, Tailwind, and code Playground

by thecodeparadox

HTML

<table>
<tbody>
                <tr><td><input type="text" class="input-small" name="article" /></td>
                    <td>
                        <select name="colore">
                            <option value="nabuk">Nabuk</option>
                            <option value="nero">Nero</option>
                            <option value="blu">Blu</option>
                            <option value="rosso">Rosso</option>
                        </select>
                     </td>
                    <td>
                        <select name="fondo">
                            <option value="gomma">Gomma</option>
                            <option value="cuoio">Cuoio</option>
                            <option value="legno">Legno</option>
                        </select>
                    </td>
                    <td>
                        <select name="numero">
                            <option value="36">36</option>
                            <option value="37">37</option>
                            <option value="38">38</option>
                            <option value="39">39</option>
                        </select></td>
                    <td><input type="number" class="input-mini" min="1" max="200" name="qnt" step="1" /></td>
                    <td></td>
                </tr>
            </tbody>
</table>

<input name="add" type="button" value="add">

JavaScript

/*$('table').on('click', '.btn', function() {
    $(this).closest('tr').remove();
});

$('input[name=add]').on('click', function() {
    var cloned = $('table tr:last').clone(true);
    $('table tr:last').find(':input').each(function() {
        cloned.find(':input[name=' + this.name + ']').val(this.value);
    });
    $('table > tbody').append(cloned);
});*/


$('table').on('click', 'input[name=add]', function() {
    var cloned = $('table tbody tr:last').clone(true);

    $('table tbody tr:last').find(':input').each(function() {
        cloned.find(':input[name=' + this.name + ']').val(this.value);
    });
    $('table tbody').append(cloned);
});