สอบถามเรื่องการ เพิ่มข้อมูลแบบ Multiple Record และ บวก ลบ ค่า อัตโนมัติ

			<form name="f1" action="#" method="POST" enctype="multipart/form-data">
				<div class="form-group row">  	
					<label class="col-sm-2 col-form-label">	
					<div class="input-group-btn after-add-more"> 
						<button class="btn btn-success add-more" id="createRows" type="button"><i class="glyphicon glyphicon-plus"></i> เพิ่ม</button>
					</div>
					</label>
					<div class="col-sm-7">
						<table width="100%" id="myTbl22"> <!--id="myTable"-->
							<tbody></tbody>
						</table>
						<br />
						<input type="hidden" id="hdnCount" name="hdnCount">
					</div>							
				</div>
			</form>

<script src="function/DataTables/jQuery-3.3.1/jquery-3.3.1.min.js"></script>
		<script type="text/javascript">
		$(document).ready(function(){
						$(".txtNumberA,.txtNumberB").keyup(function(){

							if(isNaN($(".txtNumberA").val()))
							{
								alert('Please input Number A is number');
								$(".txtNumberA").val('');
							}

							if(isNaN($(".txtNumberB").val()))
							{
								alert('Please input Number B is number');
								$(".txtNumberB").val('');
							}
							
							$(".txtNumberC").val(parseFloat($(".txtNumberA").val())+parseFloat($(".txtNumberB").val()));
						});
			var rows = 1;
				$("#createRows").click(function(){
					var tr = "<div class='control-group input-group' style='margin-top:10px;margin-bottom:20px;margin-right:10px; border: 2px dashed red; border-radius: 8px; padding: 10px;'>";
					
					tr = tr + "<label class='col-sm-2 control-label'>วันที่ลา</label>";	
					tr = tr + "<div class='col-sm-10'>";
					tr = tr + "<input type='date' name='txtdate"+rows+"' id='txtdate"+rows+"' class='form-control'>";	
					tr = tr + "</div>";	
					
					tr = tr + "<label class='col-sm-2 control-label'>ช่วงเวลา</label>";	
					tr = tr + "<div class='col-sm-10'>";	
					tr = tr + "<div class='input-group'>";	
					tr = tr + "<input type='text' class='input-small form-control txtNumberA' name='timestart"+rows+"' id='timestart"+rows+"'> <span class='input-group-addon'> ถึง </span>";	
					tr = tr + "<input type='text' class='input-small form-control txtNumberB' name='timeend"+rows+"' id='timeend"+rows+"' >";	
					tr = tr + "</div>";		
					tr = tr + "</div>";	

					tr = tr + "<label class='col-sm-2 col-form-label'></label>";	
					tr = tr + "<div class='col-sm-10'>";	
					tr = tr + "<font color='red'> หมายเหตุ รูปแบบวันที่เป็นแบบ 24 ชม. ครึ่งชั่วโมงจาก .30 ใส่เป็น .50 </font>	";	
					tr = tr + "</div>";	
					
					
					tr = tr + "<label class='col-sm-2 control-label'>จำนวนชั่วโมง</label>";
					tr = tr + "<div class='col-sm-10'>";
					tr = tr + "<input type='text' class='form-control txtNumberC' name='txtHour'  required='required' readonly>";
					tr = tr + "</div>";

					
					tr = tr + "<div class='input-group-btn'>";											
					tr = tr + "<button class='btn btn-danger remove' type='button' id='deleteRows'><i class='glyphicon glyphicon-remove'></i> ลบ</button>";											
					tr = tr + "</div>";											
					tr = tr + "</div>";
					
					$('#myTbl22 > tbody:last').append(tr);
													
					$('#hdnCount').val(rows);
					rows = rows + 1;
								
				});
				
			
				$("body").on("click",".remove",function(){ 
					$(this).parents(".control-group").remove();
				});
		});
	</script>