how to update multiple dragged image that i have already saved with database #4

[sharmaanand086]

hello everyone am updating image dragged with database but problem is that when am updating one image all the image dragged got updating with same

thank you in advance here is my code please let me know if there any one know am trying to solve this from last 2 days but not able to do
thank you so much
**this is the image div for dragging **
<div class="preview">Images</div> <div class="view imageschange "> <img alt="140x140" width="100%" height="100%" id="uniqueid" src="img/Desert.jpg" data-toggle="modal" data-target="#exampleModal"> </div>

**this code is for all the image form the database **
<?php foreach ($result as $row) { ?> <td > <input type="checkbox" value="<?php echo $row['images_id']; ?>" id="<?php echo $row['images_id']; ?>" name="image_id" required > <?php Echo "<img width='100px;' height='100px;' src=img/".$row['images_path'] .">"; ?> </td> <?php } ?> <input type="submit" style="float: right;" onclick="checkFluency()" class="btn btn-primary" value="Insert" name="changedImage" id="changedImage" />

this line of code for selecting one image form the modal using checkbox onclick event
`function checkFluency(){
var img = document.getElementsByName('image_id');
var selectedimg="";
for(var i=0; i<img.length; i++){
if(img[i].type=='checkbox' && img[i].checked==true){
selectedimg+=img[i].value+"\n";

        $.ajax({
            url: 'newtest.php',
            type: 'POST',
            data:{post_id:selectedimg},              
            success: function(response){                  
              console.log(response);
               $('.imageschange').html(response);                  
              $('#exampleModal').modal('hide');
            },
            error: function(error){
              console.log("error");
            }
      });
      
      }  
    }
  }`

**and last this line of code for response of ajax that changes the image **
`if(isset($_POST['post_id'])){
$issueID = $_POST['post_id'];//echo $issueID; // echo the data

$sql = "SELECT images_id, images_path FROM images_tbl WHERE images_id= $issueID";
//echo $sql;
$result = mysqli_query($conn, $sql);?>

<img alt="140x140" width="100%" height="100%"
src="img/" id=""
data-toggle="modal" data-target="#exampleModal">

                 <?php  }   }?> `

[andyg2]

I would aim for something more like this but I haven't tested it

<table><?php
foreach ($result as $row){
?>
<tr>
	<td>
		<input type="checkbox" value="<?php echo $row['images_id']; ?>" class="image_id_checkbox">
		<img style="width:100px; height:100px;" src="img/<?php echo $row['images_path']; ?>">
	</td>
</tr>
<?php
}
?>
</table>
<input type="submit" style="float: right;" onclick="checkFluency()" class="btn btn-primary" value="Insert" name="changedImage" id="changedImage" />

<script>
function checkFluency(){
	$("input.image_id_checkbox").each(function(){
		var checkbox = $(this);
		if(checkbox.prop("checked")){
			$.ajax({
				url: 'newtest.php',
				type: 'POST',
				data:{
					post_id:checkbox.val()
				},
				success: function(response){
					console.log(response);
					$('.imageschange').html(response);
					$('#exampleModal').modal('hide');
				},
				error: function(error){
					console.log("error");
				}
			});
		}  
	});
}
</script>

<?php 
if(isset($_POST['post_id'])){
	$issueID = intval($_POST['post_id']);
	$sql = "SELECT images_id, images_path FROM images_tbl WHERE images_id='$issueID';";
	$result = mysqli_query($conn, $sql);
	foreach ($result as $row){
	?>
		<img alt="140x140" width="100%" height="100%" src="img/<?php echo $row['images_id']; ?>" data-toggle="modal" data-target="#exampleModal">
	<?php 
	}
}
?>

[sharmaanand086]

I would aim for something more like this but I haven't tested it

<table><?php
foreach ($result as $row){
?>
<tr>
	<td>
		<input type="checkbox" value="<?php echo $row['images_id']; ?>" class="image_id_checkbox">
		<img style="width:100px; height:100px;" src="img/<?php echo $row['images_path']; ?>">
	</td>
</tr>
<?php
}
?>
</table>
<input type="submit" style="float: right;" onclick="checkFluency()" class="btn btn-primary" value="Insert" name="changedImage" id="changedImage" />

<script>
function checkFluency(){
	$("input.image_id_checkbox").each(function(){
		var checkbox = $(this);
		if(checkbox.prop("checked")){
			$.ajax({
				url: 'newtest.php',
				type: 'POST',
				data:{
					post_id:checkbox.val()
				},
				success: function(response){
					console.log(response);
					$('.imageschange').html(response);
					$('#exampleModal').modal('hide');
				},
				error: function(error){
					console.log("error");
				}
			});
		}  
	});
}
</script>

<?php 
if(isset($_POST['post_id'])){
	$issueID = intval($_POST['post_id']);
	$sql = "SELECT images_id, images_path FROM images_tbl WHERE images_id='$issueID';";
	$result = mysqli_query($conn, $sql);
	foreach ($result as $row){
	?>
		<img alt="140x140" width="100%" height="100%" src="img/<?php echo $row['images_id']; ?>" data-toggle="modal" data-target="#exampleModal">
	<?php 
	}
}
?>

i have got the solution but not the best one bye removing and again adding the class in ajax success