here is my table
<table class="table table-hover display search dataTable" id="test" cellspacing="0" >
<thead>
<tr>
<th> ID </th>
<th>Name</th>
<th>Age</th>
<th>Email</th>
</tr>
</thead>
<tbody >
<% all_employees.each do |employee|%>
<tr>
<td> <%= check_box_tag 'employee_ids[]', employee.id %> </td>
<td> <%= employee.name %> </td>
<td> <%= employee.age %> </td>
<td> <%= employee.email %> </td>
</tr>
<% end %>
</tbody>
</table>
and my js
function filtered_employee(group_id){
$.ajax({
url: "/employee_groups/"+group_id+"/associated_employees",
type: "get",
data: {
"id" : group_id
},
success: function(result) {
$('#test').html(result)
},
error: function(result){
$('#test').html(result.responseText)
}
});
}
Am using Ruby on rails with rails 4 version on a button click am calling this ajax req am getting the response as expected but when the success is triggered in ajax i get a new table painted over the old one how to resolve this issue?
Thanks in advance
I will suggest to put your <table>
within some other container and refresh that container on ajax success as follows:
<div class="tableWrapper">
<table class="table table-hover display search dataTable" id="test" cellspacing="0" >
....
</table>
</div>
And JS code:
function filtered_employee(group_id){
$.ajax({
url: "/employee_groups/"+group_id+"/associated_employees",
type: "get",
data: {
"id" : group_id
},
success: function(result) {
$('.tableWrapper').html(result)
},
error: function(result){
$('.tableWrapper').html(result.responseText)
}
});
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.