How to Add new tr in each table? - php

Question

Can anyone please please Help me. I am using laarvel framework. I want to add tr when user click on ADD NEW Service Button. The data is displayed in foreach Loop.
when user click on Add New Service
here is my Html Code:-
enter code here
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
#foreach($alldata as $data)
<div class="services-name">
<h4>{{ $data['name'] }} <button id="{{ $data['id']}}" type="button" class="btn btn-default btn-nail getid" data-toggle="modal" data-target="#myModal-nail" >
<i class="fa fa-plus" aria-hidden="true"> Add New Service</i>
</button>
</h4>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="row">
<div class="table-class">
<table class="table table-bordered" id="append-{{ $data['id'] }}">
<tr>
<th style="width:33.33%">Services</th>
<th style="width:33.33%">Duration</th>
<th style="width:33.33%">£ Price </th>
</tr>
#foreach($data['sub_services'] as $subservices)
<tr>
<td>{{ $subservices['name']}}</td>
<input type="hidden" name="service_id[]" value="{{ $subservices['service_id'] }}">
<input type="hidden" name="name[]" value="{{ $subservices['name'] }}">
<input type="hidden" name="service_is[]" value="{{ $subservices['service_is'] }}">
<td>
<div class="form-group">
<input class="form-control" type="text" name="duration[]" placeholder="Duration">
</div>
</td>
<td>
<div class="form-group">
<input class="form-control" type="text" name="price[]" placeholder="price">
</div>
</td>
</tr>
#endforeach
</table>
</div>
</div>
</div>
#endforeach
</div>
And here is My modal
enter code here
<div class="modal fade" id="myModal-nail" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="add-cat"> Add Service</h4>
</div>
<form class="servicedata" role="form" method="POST" action="Javascript:;">
{{ csrf_field() }}
<div class="modal-body">
<div class="form-group row">
<span class="col-xs-3 add-cate-model">Add Service</span>
<div class="col-xs-8">
<input name="name" class="form-control mdl-txt txtfield m-tb-10" type="text" placeholder="Add Service" >
<input type="hidden" name="list_id" value="{{ $listid }}">
<input type="hidden" class="service" name="service_id" value="">
</div>
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary addService">Submit</a>
</div>
</form>
</div>
</div>
Jquery Code:-
enter code here
$(document).on('click','.getid', function(){
var serviceid = $(this).attr('id');
alert(serviceid);
$('.addService').addClass(serviceid);
$('.'+serviceid).on('click',function(){
$('.service').val(serviceid);
if(flag==1) {
$.ajax({
type: "POST",
url: "add-category-service",
data: $('.servicedata').serialize(),
success:function(resp){
if($.trim(resp)){
$("#append-"+serviceid).append(resp);
$('.addService').removeClass(serviceid);
$('#myModal-nail').modal('hide');
} else{
alert("error"); return false;
}
}
});
}
});
});
And My laravel function:-
enter code here
ublic function addCategoryService(Request $request){
if($request->ajax()){
$data = $request->input();
//echo "<pre>"; print_r($data); die;
unset($data['_token']);
$subservice = new SessionSubService;
$subservice->name = $data['name'];
$subservice->list_id = 1;
$subservice->service_id = $data['service_id'];
$subservice->service_is = "top";
$subservice->save();
echo '<tr>
<td>'. $data['name'].'</td>
<input type=hidden name=service_id[] value=' .$data['service_id'].'>
<input type=hidden name=name[] value=' . $data['name']. '>
<input type=hidden name=service_is[] value=top>
<td>
<div class=form-group>
<input class="form-control" type="text" name="duration[]" placeholder="Duration">
</div>
</td>
<td>
<div class=form-group>
<input class=form-control type=text name=price[] placeholder=price>
</div>
</td>
</tr>'; die;
}
}