使用ajax和php删除表html中的行

Question

如何使用 ajax 和 php 删除表格 html 中的行， 我需要删除 html 表中的行选择行并单击按钮删除使用 ajax 进行删除当前可以在没有 ajax 的情况下进行删除，但我需要删除行并留在页面上而不在其他页面上提交 代码 JavaScript

function getDelete()
{


$.ajax({
        type:"post",
        //dataType:"json",
        data:"id="+id,
        url:"delete_address.php?id=$id",   // url of php page where you are writing the query       
 success:function(json)
 { 


 },
error:function(){

        }
        });

}

代码html和php

<?php
  $resualt=mssql_query("SELECT * FROM Address where user_id='$UserId' ") ;
  echo "<table border='1' class='imagetable' id='imagetable' 
  width='400px'    >\n";
  echo '<thead>'.'<tr>';
  echo '<th>Street</th>'.'<th>Quarter</th>'.
  '<th>From</th>'.'<th>To</th>'.'<th>Notes</th>';
  echo '</tr>'.'</thead>';
  echo '<tbody>';
  while ($row = mssql_fetch_assoc($resualt)) {
  $fromDate=$row['from_date'];
  $toDate=$row['to_date'];
  echo " <tr onClick='myPopup($row[id])'". 
  ( $_GET['id'] == $row['id'] ?   
  "style='background-color:  green;'":"").">\n"."<td >
  {$row['street']} </td>\n".
  "<td>{$row['quarter']}</td>\n"."<td>$fdate2</td>\n".
  "<td>$tdate2</td>\n"."<td>{$row['other_info']}</td>\n";
 }
 echo '</tbody>';
 echo "</table>\n";
?>
 <?php 
 echo"<a class='button-link' onClick='getDelete()'>delete</a>";
 ?>

代码sql查询

<?php
 $idEmploye=$_GET['id'];
 $userId=$_GET['user_id'];
 $db_host = 'MOHAMMAD-PC\SQL2005';
 $db_username = 'sa';
 $db_password = '123321';
 $db_name = 'db_test';
 mssql_connect($db_host, $db_username, $db_password);
 mssql_select_db($db_name); 
 mssql_query("DELETE FROM Address
 WHERE id='$idEmploye' ; ") or die(mssql_error()) ;
 echo '<script language="javascript">';
 echo 'alert("successfully deleted ")';
 echo '</script>';
 echo "<script>setTimeout(\"location.href ='address.php';\",10);     </script>"; 

 ?>

任何帮助非常感谢

Answer 1

试试这个解决方案

HTML：

<table>
    <tr>
        <td>Username</td>
        <td>Email</td>
        <td>Action</td>
    </tr>
    <tr>
        <td>TheHalfheart</td>
        <td>TheHalfheart@gmail.com</td>
        <td>
            <input type="button" class="delete-btn" data-id="1" value="Delete"/>
        </td>
    </tr>
    <tr>
        <td>freetuts.net</td>
        <td>freetuts.net@gmail.com</td>
        <td>
            <input type="button" class="delete-btn" data-id="2" value="Delete"/>
        </td>
    </tr>
</table>

我们有两个按钮的属性调用 data-id 和类 delete-btn

AJAX jQuery：

    <script language="javascript">
    $(document).ready(function(){

        $('.delete-btn').click(function(){

            // Confirm
            if ( ! confirm('Are you sure want to delete this row?')){
                return false;
            }

            // id need to delete
            var id = $(this).attr('data-id');

            // Current button 
            var obj = this;

            // Delete by ajax request
            $.ajax({
                type : "post",
                dataType : "text",
                data : {
                    id : id
                },
                success : function(result){
                    result = $.trim(result);
                    if (result == 'OK'){
                        // Remove HTML row
                        $(obj).parent().parent().remove();
                    }
                    else{
                        alert('request fails');
                    }
                }
            });

        });

    });
</script>

在 PHP 中：

• 获取ID并删除
• 成功则回复OK

对不起，我在学英语，如果不好请指正