как удалить данные из базы данных в php, ajax, javascript (без jquery)

Question

Я пытаюсь удалить данные из базы данных, но когда я нажимаю кнопку «Удалить», то удаляется первая строка, а не там, где я нажимаю.мой код PHP:

<?php
    $connect = mysqli_connect("localhost","root","","abu");
    if($connect){
        $showdata = mysqli_query($connect,"SELECT * FROM dealers");
        if(mysqli_num_rows($showdata)>0){
            $i = 1;
            while($rows = mysqli_fetch_assoc($showdata)){
                echo "<tr>";
                echo "<td>".$i."</td>";
                echo "<td>".$rows["dealer_name"]."</td>";
                echo "<td><button onclick='deleteproduct()' class='delete'>Delete</button><input type='hidden' id='productid' vlaue='".$rows["id"]."'></td>";
                echo "</tr>";
                $i++;
            }
        }else {
            echo "<center><i>No Dealers to show</i></center>";
        }
    }
?>

И это мой код ajax:

function deleteproduct(){
    if(window.XMLHttpRequest){
        http = new XMLHttpRequest();
    }else {
        http = new ActiveXObject("Microsoft.XMLHTTP");
    }


    http.onreadystatechange = function(){
        if(http.readyState == 4 && http.status == 200){
            document.getElementById("alerts").innerHTML = http.responseText;
        }
    }

    var delid = document.getElementById("productid").value;
    var file = "assets/php/addproduct_deletedata.php";
    var senddata = "productid="+delid;

    http.open("POST",file,true);
    http.setRequestHeader("content-type","application/x-www-form-urlencoded");
    http.send(senddata);
}

Я хочу, чтобы при нажатии на кнопку удаления удалялась строка, в которой я нажимал, а не другие.

Answer 1

ПЕРВЫЙ ИЗ ВСЕХ, ЧТО ВЫ НЕ МОЖЕТЕ НАЗНАЧИТЬ ЖЕ ИДЕНТИФИКАТОР БОЛЬШЕ, ЧЕМ ОДИН ЭЛЕМЕНТЫ НА СТРАНИЦЕ .

Браузер не будет возражать, но он делает HTML недействительным. Вы можете использовать атрибут класса для этой цели.

Вы можете проверить свой HTML онлайн здесь

echo "<td><button onclick='deleteproduct()' class='delete'>Delete</button><input type='hidden' id='productid' vlaue='".$rows["id"]."'></td>";

По вашему требованию вы можете использовать тег привязки вместо использования формы со скрытым полем ввода, чтобы уменьшить размер DOM, вызывать функцию по щелчку и передавать функцию productId в качестве параметра.

Вот код:

<?php
    $connect = mysqli_connect("localhost","root","","abu");
    if($connect){
        $showdata = mysqli_query($connect,"SELECT * FROM dealers");
        if(mysqli_num_rows($showdata)>0){
            $i = 1;
            while($rows = mysqli_fetch_assoc($showdata)){
                echo "<tr id='row-".$rows["id"]."'>";
                echo "<td>".$i."</td>";
                echo "<td>".$rows["dealer_name"]."</td>";
                echo "<td><a href='#' onclick='return deleteproduct(".$rows["id"].")'>Delete</a></td>";
                echo "</tr>";
                $i++;
            }
        }else {
            echo "<center><i>No Dealers to show</i></center>";
        }
    }
?>

JavaScript:

function deleteproduct( delId ){
   var tableRowId = 'row-'+delId;

   // you got delId and tableRowId to remove the table row 

   // do ajax stuff here...


   return false;
}

Дайте мне знать, как все прошло.

Answer 2

1. потому что его "значение", а не "vlaue";)

тип ввода = 'скрытый' id = 'productid' vlaue = '". $ row [" id "]."'

2.вы перебираете свой набор результатов и распечатываете поле ввода с идентификатором "productid".

В вашем коде столбец EVERY имеет идентификатор SAME .Вот почему ваш JavaScript не работает, как ожидалось.Идентификатор должен быть уникальным .

Вам необходимо отправить значение (идентификатор продукта) в качестве параметров функции.Сделайте это так:

<input type="hidden" onclick="deleteproduct(this.value)" value="$yourRowId"/>

или

<input type="hidden" onclick="deleteproduct($yourRowId)" />

, и вот как вы можете получить значение в JS:

<script type="text/javascript">
function deleteproduct(id)
{
    alert(id); // your product ID
}
</script>