Delete record without refresh page using php

StackOverflow https://stackoverflow.com/questions/12614167

Question

I have HTML and PHP code as below:

HTML

<a href="deleteData.php?id=<?php echo $value['id']?>"><button name="delte" class="btn">Delete</button></a>

deleteData.php

<?php
include ('include/connectdb.php');
$getid = $_GET['id'];
$sql = ("UPDATE tblworkfaire SET status=0 where id = ".$getid);
$res = mysql_query($sql) or die (mysql_error());

?>

This works great except that after the record is deleted the record is still displayed on the page until it is refreshed.How do I fix this.Anyone have any idea help me please.Thanks,

Était-ce utile?

La solution

Creaet Delete.php File

 include_once'DBConnect.php';
 if(isset($_REQUEST['userid']) && $_REQUEST['userid'])
 {
 $delObj= new DBConnect();
 $delObj->DeleteData($_REQUEST['userid']);
 }

create DBConnect.php File

<?php

class DBConnect
{
function DBConnect()
{
    $link= mysql_connect("localhost","root","")or die("Local Host Error".mysql_error());
    mysql_select_db("mydb");

}

 function viewData()
{

    $query="select * from userinfo";
    $resultset=mysql_query($query) ;

    return $resultset;


}

function DeleteData($userID)
{

    $query="DELETE from userinfo where id=".$userID;

    $resultset=mysql_query($query) ;

}


}

?>

Create index.php file

<script>
function deletedata(id)
{
    var xmlhttp;    
    if (id=="")
      {
          document.getElementById("Display").innerHTML="";
          return;
      }
    if (window.XMLHttpRequest)
      {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
      }
    else
    {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function()
    {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
          {
            window.location.reload()

          }
    }
        xmlhttp.open("GET","delete.php?userid="+id,true);
        xmlhttp.send();

}
</script>    




<?php include 'DBConnect.php';
$ViewObj= new DBConnect();
$ResultSet=$ViewObj->viewData();?> // I have created one function which will get all the data from the database if you don't want to do this just call deletedata() function onClick event and pass Record ID as agrument which you want to delete on DELETE button.
<br /><br /><br />
<span id ="Display">
<table align="center" border="1">
<tr>
      <th>Name</th>
      <th>operation</th>
</tr>
<?php
while($row= mysql_fetch_array($ResultSet))
{?>


<tr>
    <td><input type="checkbox"></td>
    <td><?php echo $row[1];?></td>

    <td align="center"><a href="#" onclick="deletedata('<?php echo $row[0];?>')" style="color:#FF0000"><b>Delete</b></a>

    </td>
</tr>

<?php 


}
?>
</table>

I think this will help you :)

Let me know if you are finding any problem.

Autres conseils

Try Something like this ---

jQuery.ajax({
        type: "GET",
        url: deleteData.php,
        data:{'id':id},
        success:function(results)
        {   
                 .....
        }
        });

You should use Ajax. Try maybe with jQuery:
http://api.jquery.com/jQuery.ajax/

Then onSuccess method delete row using jQuery too.

Here is the Complete Source Code for Delete Record without Refreshing the Page.

Follow the Steps:

Step1:

DBConnect.php

  class DBConnect
  {
    function DBConnect()
    {
       $link= mysql_connect("localhost","root","")or die("Local Host Error".mysql_error());
       mysql_select_db("test");
    }

    function viewData()
    {
      $query = "SELECT * FROM test_mysql";
      $resultset = mysql_query($query);
      return $resultset;
    }

    function DeleteData($userID)
    {
      $query = "DELETE FROM test_mysql WHERE id=".$userID;
      $resultset=mysql_query($query) ;
    }
  }

Step2:

 delete.php

   include_once'DBConnect.php';    
   if(isset($_REQUEST['userid']) && $_REQUEST['userid'])    
   {    
     $delObj= new DBConnect();    
     $delObj->DeleteData($_REQUEST['userid']);    
   }

Step 3:

 index.php

    <html>
    <head>
    <title></title>
    <script type="text/javascript">
    function deletedata(id)
    {
      var xmlhttp;    
      if (id=="")
        {
            document.getElementById("Display").innerHTML="";
            return;
        }
      if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
      else
      {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
      xmlhttp.onreadystatechange=function()
      {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
              window.location.reload()

            }
      }
          xmlhttp.open("GET","delete.php?userid="+id,true);
          xmlhttp.send();

    }
    </script>
    </head>
    <body>
    <?php 
    include 'DBConnect.php';
    $ViewObj= new DBConnect();
    $ResultSet=$ViewObj->viewData();
    ?>
    <span id ="Display">
    <table align="center" border="1" width="50%" cellpadding="4" cellspacing="4">
    <tr>
      <th>ID</th>
      <th>Name</th>
      <th>operation</th>
      <th align="center">Action</th>
    </tr>
    <?php
    while($row= mysql_fetch_array($ResultSet))
    {
    ?>
    <tr>
      <td><?php echo $row[0];?></td>
      <td><input type="text" name="txt"></td>
      <td><?php echo $row[1];?></td>
      <td align="center"><a href="#" onClick="deletedata('<?php echo $row[0];?>')" style="color:#00F"><b>Delete</b></a></td>
    </tr>
    <?php
    }
    ?>
    </table>
    </span>
    </body>
    </html>

if You Feel any problem then please let me know.hope it will help you. Thank you.

Use redirect('my_original_page.php') it will redirect to your main page but it should be placed after the delete query is execueted

You have to use AJAX for this

use this tutorial

Deleting values from MySQL database with AJAX without page reload (edited)

It will help you out.

Either you can use php function header('location:yourPage.php'); or do with the help of Ajax.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top