<!DOCTYPE html> <html> <head> <title>jQuery Add Table Rows</title> <style> table{ width: 100%; margin: 25px 0; border-collapse: collapse; } table, th, td{ border: 1px solid #6C220B; } table th, table td{ padding: 8px; text-align: left; } </style> <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script> $(document).ready(function(){ $(".row").click(function(){ var name = $("#name").val(); var dvt = $("#dvt").val(); var sl = $("#sl").val(); var dg = $("#dg").val(); var t2 = $("#t2").val(); var markup = "<tr><td><input type='checkbox' name='record'></td><td>" + name + "</td><td>" + dvt + "</td><td>" + sl + "</td><td>" + dg + "</td><td>" + t2 + "</td></tr>"; $("table tbody").append(markup); }); }); </script> </head> <body> <h2>TỜ TRÌNH</h2> <form> Căn cứ lệnh công tác:<input type="text"></br> 1. Họ tên: </br> 2. Loại phương tiện: 3. Biển số:</br> 4. Định đường loại I (a):</br> 5. ĐM đường loại II (b):</br> 6. Chỉ số công tơ mét đi (1): Chỉ số công tơ mét về (2):</br> 7. Số km đã thực hiện (2-1): </br> <input type="text" id="name" placeholder="Tên nhiên liệu"> <input type="text" id="dvt" placeholder="ĐVT"> <input type="text" id="sl" placeholder="Số lượng"> <input type="text" id="dg" placeholder="Đơn giá bao gồm cả VAT"> <input type="text" id="t2" placeholder="Thành tiền"> <input type="button" class="row" value="Click to Add Row"> </form> <table> <thead> <tr> <th>Choose</th> <th>Tên NL</th> <th>ĐVT</th> <th>Số lượng</th> <th>ĐG gồm VAT</th> <th>Thành tiền</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="result"></td> <td>#</td> <td>#</td> <td>#</td> <td>#</td> <td>#</td> </tr> </tbody> </table> </body> </html>
We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy. Accept Learn more