I want to change the value of input-box and file-input-box using ajax.
But the problem is that i am unable to change the image input-box value using change value function in jquery ajax.
the code is like below
<body>
<div class="container">
<h3>player Registration</h3>
<form action="" method="post" class="form-control"
enctype="multipart/form-data">
Player Name: <input type="text" name="playername" id="playername" class="form-control">
<br>
Select Team: <select name="teamname" id="teamname" class="form-control">
<?php foreach ($arr as $key=>$value):?>
<option value="<? echo $arr[$key]['team_id']; ?>"><? echo $arr[$key]['team_name']; ?></option>
<?php endforeach; ?>
</select>
<br>
Select Role: <select name="playerrole" id="playerrole" class="form-control">
<?php while($row = mysqli_fetch_array($result2))
echo "<option value='" . $row['role_id'] . "'>" . $row['role_name'] . "</option>";?>
</select>
<br>
player Photo: <input type="file" (change)="onFileChange($event)" name="playerphoto" id="playerphoto" class="form-control">
<br>
<input type="submit" value="Submit" class="btn btn-primary">
<input type="reset" value="Reset" class="btn btn-warning">
</form>
<table class="table table table-striped">
<thead>
<tr>
<th scope="col">playerid</th>
<th scope="col">player name</th>
<th scope="col">player_team_id</th>
<th scope="col">Player_role_id</th>
<th scope="col">Player_photo</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
<?php
$sql2 = mysqli_query($conn,"select * from player_master");
$arr3 = mysqli_fetch_all($sql2,MYSQLI_ASSOC);
foreach ($arr3 as $key => $value):
echo '<tr>';
echo'<td scope="row">' .$arr3 [$key]['player_id'].'</td>';
echo'<td>' .$arr3 [$key]['player_name'].'</td>';
echo'<td>' .$arr3 [$key]['player_team_id'].'</td>';
echo'<td>' .$arr3 [$key]['player_role_id'].'</td>';
// echo'<td><img style="width:100px;height:80px"src="playerphotos/' .$arr3 [$key]['player_photo'].'"></td>';
echo'<td>' .$arr3 [$key]['player_photo'].'</td>';
echo'<td><button class="pledit" value="'. $arr3 [$key]['player_id']. '" >edit</button></td>';
echo'<td><button class="pldelete" value="'. $arr3 [$key]['player_id']. '" >delete</button</td>';
echo'</tr>';
endforeach;
?>
</tbody>
</table>
</div>
</body>
<script src="../../../requirements/jquery.js"></script>
<script>
$(document).ready(function()
{
$('.pledit').click(function(){
alert('hyy');
$.ajax({
url:'edit.php',
type: "POST",
dataType: "JSON",
data :{player_id:$(this).val()},
success:function(res){
console.log(res);
$('#playername').val(res.player_name);
$('#teamname').val(res.player_team_id);
$('#playerrole').val(res.player_role_id);
$('#playerphoto').val(res.player_photo);
}
})
})
});
</script>
so how can i change the $(‘#playerphoto’).val(res.player_photo);
except the file input everything else working fine..
please help.