how to get row value with ajax triggered by onchange dropdown?

502
January 29, 2017, at 7:55 PM

I tried to update 1 row in table with ajax triggered by onchange dropdown, I succeed update data but it updating all data in my table.

so how I can get unique value (eg :User ID) to pass it from ajax to my php so i can update it only 1 row?

here's my code :

my table (transactions.php)

<table class="table table-bordered table-hover table-striped">
   <thead>
      <tr>
         <th>User ID</th>
         <th>Pengirim</th>
         <th>Jumlah Transfer</th>
         <th>Berita Acara</th>
         <th>Status</th>
         <th>Rincian</th>
      </tr>
   </thead>
   <tbody>
      <?php
         $query = mysqli_query($koneksi, "select * from konf_transf order by tanggal desc limit 7 ");
         while($data1 = mysqli_fetch_array($query)){
            ?>
      <tr>
         <td>
            <center><?php echo $data1['usr_id']; ?></center>
         </td>
         <td>
            <center><?php echo $data1['nm_pengirim']; ?></center>
         </td>
         <td>
            <center>Rp. <?php echo number_format($data1['jmlh_transf'],0,'','.'); ?>,-</center>
         </td>
         <td>
            <center><?php echo $data1['berita_acara']; ?></center>
         </td>
         <td>
            <center><?php echo $data1['status']; ?></center>
         </td>
         <td>
            <center>
               <select name="pilihstatus" id="pilihstatus" onchange="updatetransactions();">
                  <option value="Pilihan">Pilihan</option>
                  <option value="Sudah">Sudah</option>
                  <option value="Belum">Belum</option>
               </select>
            </center>
         </td>
      </tr>
      <?php } ?>
   </tbody>
</table>

and here my ajax

function updatetransactions(){
  var id = $('select option:selected').val();  
$.ajax({
            type:"post",
            url:"updatestatustransaksi.php",
            data:"status="+id,
            success:function(data){
                alert('Successfully updated mysql database');
            }
        });
    }

my updatestatustransaksi.php

<?php
require_once("koneksi.php");
session_start();
if (!isset($_SESSION['username'])) {
    echo "<script>alert('You must register an account first, we will redirect you to register page !'); window.location = 'registuser.php'</script>";
}
$dataupd = $_POST["status"];
$query   = mysqli_query($koneksi, "UPDATE `konf_transf` SET `status` = '$dataupd' WHERE `id` = '$penjualan_id'");
if ($query) {
    echo "<script>alert('Update Success.'); window.location = 'transactions.php' </script>";
} else {
    echo "<script>alert('Update Failure.'); window.location = 'transactions.php' </script>";
}
Answer 1

I assume that you update all of your rows in your database, with no WHERE condition. In your script, lets also get the corresponding id of that row in your database.

Lets assign first the id for each table row:

while($data1 = mysqli_fetch_array($query)){
        ?>
  <tr id="<?=($data1['user_id'])?>">

Then, lets change how you trigger your javascript. Lets first change the <select> field:

<select name="pilihstatus" id="pilihstatus" class="pilihstatus">

Then, get the corresponding id using the script below:

$(".pilihstatus").change(function(){
    var elem = $(this),
        selecteditem = elem.val(),
        id = elem.closest('tr').attr('id');
    $.ajax({
        type:"post",
        url:"updatestatustransaksi.php",
        data: {'status':selecteditem, 'id':id},
        success:function(data){
            alert('Successfully updated mysql database');
        }
    });
});

And on your updatestatustransaksi.php file (please use prepared statement):

$stmt = $koneksi->prepare("UPDATE `konf_transf` SET `status` = ? WHERE `id` = ?");
$stmt->bind_param("si", $_POST['selecteditem'], $_POST['id']);
$stmt->execute();
$stmt->close();
Answer 2

Have you initialise $penjualan_id?? I think you need to initialise it by $penjualan_id=$_SESSION['user_id']

Answer 3

Try adding data_id attribute to select

<table class="table table-bordered table-hover table-striped">
   <thead>
      <tr>
         <th>User ID</th>
         <th>Pengirim</th>
         <th>Jumlah Transfer</th>
         <th>Berita Acara</th>
         <th>Status</th>
         <th>Rincian</th>
      </tr>
   </thead>
   <tbody>
      <?php
         $query = mysqli_query($koneksi, "select * from konf_transf order by tanggal desc limit 7 ");
         while($data1 = mysqli_fetch_array($query)){
            ?>
      <tr>
         <td>
            <center><?php echo $data1['usr_id']; ?></center>
         </td>
         <td>
            <center><?php echo $data1['nm_pengirim']; ?></center>
         </td>
         <td>
            <center>Rp. <?php echo number_format($data1['jmlh_transf'],0,'','.'); ?>,-</center>
         </td>
         <td>
            <center><?php echo $data1['berita_acara']; ?></center>
         </td>
         <td>
            <center><?php echo $data1['status']; ?></center>
         </td>
         <td>
            <center>
               <select name="pilihstatus" id="pilihstatus" onchange="updatetransactions();" data_id='<?php echo $data1['usr_id']; ?>'>
                  <option value="Pilihan">Pilihan</option>
                  <option value="Sudah">Sudah</option>
                  <option value="Belum">Belum</option>
               </select>
            </center>
         </td>
      </tr>
      <?php } ?>
   </tbody>
</table>

and get that data_id value in your function

function updatetransactions(){
  var status = $('select option:selected').text();
  var status = $('select').attr('data_id');
  var id = $('select option:selected').val();  
$.ajax({
            type:"post",
            url:"updatestatustransaksi.php",
            data:{'status'=status,'id'=id}
            success:function(data){
                alert('Successfully updated mysql database');
            }
        });
    }

and at your updatestatustransaksi.php

  <?php
require_once("koneksi.php");
session_start();
if (!isset($_SESSION['username'])) {
    echo "<script>alert('You must register an account first, we will redirect you to register page !'); window.location = 'registuser.php'</script>";
}
$dataupd = $_POST["status"];
$id = $_POST["id"];
$query   = mysqli_query($koneksi, "UPDATE `konf_transf` SET `status` = '$dataupd' WHERE `id` = '$id'");
if ($query) {
    echo "<script>alert('Update Success.'); window.location = 'transactions.php' </script>";
} else {
    echo "<script>alert('Update Failure.'); window.location = 'transactions.php' </script>";
}
Rent Charter Buses Company
READ ALSO
ASP.net MVC can&#39;t access ajax data in the controller function

ASP.net MVC can't access ajax data in the controller function

I use x-editable and try to post date to my controller

376
How do I get the index of a specific column in a grouped column (multi header) Kendo grid

How do I get the index of a specific column in a grouped column (multi header) Kendo grid

I have kendo grid which has grouped column headers (Two headers) binded with data sourceI am using the following code to get the column index of single header row grid which is working fine

461
ajax POST: 405 (Method Not Allowed)

ajax POST: 405 (Method Not Allowed)

At the time of uploading image i am getting 405 (Method Not Allowd) errorBelow are the reference of HTML, JavaSceipt and php file code

958
International Telephone Input with Country sync for plugin not working

International Telephone Input with Country sync for plugin not working

I using intlTelInput for the telephone & mobile field on aspnet webform website

449