I'm trying to display a list of players with a edit button next to each one. When edit is pressed, then the user can edit that player. I'm trying to do this using ajax. The problem: The table will display for a split second then it's a blank screen.
<?php foreach($players as $player): ?>
<tr>
<td><?= $player['first_name']; ?></td>
<td><?= $player['last_name']; ?></td>
<td><?= $player['email']; ?></td>
<td align="center" >
<form action="" method="post" id="edit_player">
<input type="hidden" name="user_id" value="<?= player['user_id']; ?>">
<input type="submit" value='Edit' name='submit'>
</form>
</td>
</tr>
<?php endforeach;?>
Here is my jquery/ajax code. I made some changes from earlier. I think it's better, but it's still not working.
$(document).ready(function() {
var contents = $('#teamMain');
$('.edit_player').each(function(index, value) {
var formData = $(this).attr('user_id');
$.ajax({
url: 'views/team_nav.php',
type: 'POST',
cache: false,
data: formData,
success: function(data){
contents.html(data);
}
});
});
});