I have this Code where i just select two players and i show some stats of those players. I'm Using Just A regular table to show the data (image1);
My Problem is , after i select another player , instead of updating the data from the new player i selected , the table just create another line (image2). all the data that show's are correct , but i dont want it to create another line on the table , i want to erase the past player and update to the current player but i dont know how i can acomplish that.
I'm Not the best with jquery , that's my code
<script>
$(document).ready(function() {
//The First player Select
jQuery("#p1").on('focusout', function(e) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
}
});
var p1 = $('#p1').val();
var p2 = $('#p2').val();
jQuery.ajax({
url: "{{ route('ajax') }}/?p1=" + p1 + "&p2=" + p2,
method: 'Get',
success: function(result) {
$("#player1").append("<h2 class='p1'>" + result[0].player + "</h2>");
$("#p1kills").append("<h2 class='alignRight'>" + result[0].kp + "</h2>");
$("#p1kda").append("<h2 class='alignRight'>" + result[0].kda + "</h2>");
$("#p1cspm").append("<h2 class='alignRight'>" + result[0].cspm + "</h2>");
$("#p1gpm").append("<h2 class='alignRight'>" + result[0].gpm + "</h2>");
$("#p1dpm").append("<h2 class='alignRight'>" + result[0].dpm + "</h2>");
}
});
});
//The Second player Select
jQuery("#p2").on('focusout', function(e) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
}
});
var p2 = $('#p2').val();
var p1 = $('#p1').val();
jQuery.ajax({
url: "{{ route('ajax') }}/?p1=" + p1 + "&p2=" + p2,
method: 'Get',
success: function(result) {
$("#player2").append("<h2 class='p1' >" + result[1].player + "</h2>");
$("#p2kills").append("<h2 >" + result[1].kp + "</h2>");
$("#p2kda").append("<h2 >" + result[1].kda + "</h2>");
$("#p2cspm").append("<h2 >" + result[1].cspm + "</h2>");
$("#p2gpm").append("<h2 >" + result[1].gpm + "</h2>");
$("#p2dpm").append("<h2 >" + result[1].dpm + "</h2>");
}
});
});
});
</script>
.html()instead of.append().