Skip to content

Instantly share code, notes, and snippets.

@srkama
Last active August 29, 2015 14:02
Show Gist options
  • Save srkama/85419b50104072031f9f to your computer and use it in GitHub Desktop.
Save srkama/85419b50104072031f9f to your computer and use it in GitHub Desktop.
Adding rows dynamically
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<a id="add">+</a></td>
<form id="id_form">
<table id="mytable" width="300" border="1" cellspacing="0" cellpadding="2">
<tbody>
<tr>
<td>Name</td>
</tr>
<tr class="person">
<td><input type="text" name="name" id="name" /></td>
<td><select name="hello" id="id_hello">
<option>sdlkfjsladkjflkjsa</option>
<option>sdlkfjsladkjflkjsa</option>
<option>sdlkfjsladkjflkjsa</option>
<option>sdlkfjsladkjflkjsa</option>
<option>sdlkfjsladkjflkjsa</option>
</select></td>
</tr>
</tbody>
</table>
</form>
<button id="id_button">Save</button>
</body>
</html>
$(document).ready(function() {
$("#add").click(function() {
$('#mytable tbody>tr:last').clone(true).insertAfter('#mytable tbody>tr:last');
$("#mytable tbody>tr:last").find("input,select").val("");
return false;
});
$("#id_button").click(function() {
console.log($('#id_form').serialize());
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment