Serial Number

by Soumya Rao

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<div class="panel panel-primary">
  <div class="bs-example">
    <div class="Container">
      <table class="table table-hover small-text" style="margin-top: 50px;" id="tb" border="1px">
        <tbody>
			<td>
				<th>Student Name </th>
				<th>Marks</th>
			</td>
        </tbody>
        <tfoot>
          <th colspan="2">GRAND TOTAL</th>
          <td>
            <input type="text" name="GrandTotal[]" id="table-grand-total" class="table-total form-control" disabled>
          </td>
        </tfoot>
      </table>
    </div>
  </div>
</div>

JavaScript

$(function() {
  var students = 0;

  function studentTemplate(students) {

    return '<tr class="student_name"><td colspan="2"><b>Student Name</b></td><td colspan="1"> <input type="text" name="student_names[]" class="form-control" placeholder="Student Name"> </td><th><a style="font-size:18px;width:33%;" class="newstudent" title="Add More Person"><span class="glyphicon glyphicon-plus"></span></a></th><td><input type="text" name="SNo1[]" class="form-control"></td>  </tr><tr class="student_marks"> <td><b>Subject Name and Marks</b></td><td> <input type="text" name="subnames[]" class="form-control" placeholder="Subject Name"> </td><td> <input type="number" name="marks[]" class="marks student_' + students + ' form-control" student_ref="student_' + students + '" placeholder="Marks"> </td><th><a style="font-size:18px;width:33%;" class="addsubject" ><span class="glyphicon glyphicon-plus"></span></a></th><td><input type="text" name="SNo1[]" class="form-control"></td> </tr><tr class="subtotal"> <td colspan="2"><b>Sub - Total</b></td><td> <input type="text" name="subtotals[]" class="row-total student_' + students + ' form-control" disabled> </td></tr>';
	numberRows();

  }

  function subTemplate(students) {
    return '<tr class="student_marks"> <td><b>Subject Name and Marks</b></td><td> <input type="text" name="subnames[]" class="form-control" placeholder="Subject Name"> </td><td> <input type="number" name="marks[]" class="marks student_' + students + ' form-control" student_ref="student_' + students + '" placeholder="Marks"> </td><th><a style="font-size:18px;width:33%;" class="addsubject" ><span class="glyphicon glyphicon-plus"></span></a></th><td><input type="text" name="SNo1[]" class="form-control"></td>  </tr>';
	 numberRows();
  }
  function numberRows() {
      $('input[name^="SNo"]').each(function(i) {
            $(this).val(i + 1);
      });
		}
    numberRows();
	
	function numberRows() {
      $('input[name^="SNo1"]').each(function(i) {
           ...