Changing PHP function to Javascript/AJAX validation

Question

I want to use AJAX/Javascript with PHP to carry out this following function and not have it all done by PHP itself. I have created a function which deletes an item from the MySQL database. It gives a validation to the user if they want to remove it by selecting Yes or No.

However, how would i change this so that it does the same function but the validation appears as a popupbox, and when Yes or OK is pressed it deletes the item from the database and reloads the page to show it has been removed.

I have provided the PHP code which relates to this function, but i want to specifically change this to using AJAX/Javascript as well in accordance with PHP.

<?php 
    // Delete Item Question to Admin, and Delete Product if they choose
    if (isset($_GET['deleteid'])) {
        echo 'Do you really want to delete product with ID of ' . $_GET['deleteid'] . '? <a href="inventory_list.php?yesdelete=' . $_GET['deleteid'] . '">Yes</a> | <a href="inventory_list.php">No</a>';
        exit();
    }
    if (isset($_GET['yesdelete'])) {
        // remove item from system and delete its picture
        // delete from database
        $id_to_delete = $_GET['yesdelete'];
        $sql = mysqli_query($link,"DELETE FROM products WHERE id='$id_to_delete' LIMIT 1") or die (mysql_error());
        // unlink the image from server
        // Remove The Pic -------------------------------------------
        $pictodelete = ("../inventory_images/$id_to_delete.jpg");
        if (file_exists($pictodelete)) {
                    unlink($pictodelete);
        }
        header("location: inventory_list.php"); 
        exit();
    }
    ?>
<?php 
// This block grabs the whole list for viewing
$product_list = "";
$sql = mysqli_query($link,"SELECT * FROM products ORDER BY date_added DESC");
$productCount = mysqli_num_rows($sql); // count the output amount
if ($productCount > 0) {
    while($row = mysqli_fetch_array($sql)){ 
             $id = $row["id"];
             $product_name = $row["product_name"];
             $price = $row["price"];
             $stock = $row["stock"];
             $date_added = strftime("%b %d, %Y", strtotime($row["date_added"]));
             $product_list .= "Product ID: $id - <strong>$product_name</strong> - &pound;$price - Stock: $stock - <em>Added $date_added</em> &nbsp; &nbsp; &nbsp; <a href='inventory_edit.php?pid=$id'>edit</a> &bull; <a href='inventory_list.php?deleteid=$id'>delete</a><br />";

    }
} else {
    $product_list = "You have no products listed in your store yet";
}
?>

And what's exactly your question ? Are you asking us to write the code ? — Denys Séguret, Apr 13 '14 at 14:46
How would i approach it, what bits would i need to change? Wouldnt mind the code being written but i can try myself. — user3411002, Apr 13 '14 at 14:48
Dont get caught out with a CSRF link like (due to the XSS hole) `inventory_list.php?yesdelete=1' or '1'='1';--` http://stackoverflow.com/questions/60174/how-can-i-prevent-sql-injection-in-php?rq=1 — Lawrence Cherone, Apr 13 '14 at 14:53

sydev · Accepted Answer · 2014-04-13T17:31:06.270

1

Your JS-File

$(document).ready(function() {
  $('.delete').click(function() {
    event.preventDefault();
    var deleteId = $(this).parent().attr('id').val();
    $.get('path/to/you/phpfile', {deleteId: deleteid}, function(data) {
      var confirm = confirm(data);
      if (confirm==true) {
        $.get('path/to/you/phpfile', {yesdelete: 1});
      }
    });
  });
});

In your PHP-File you have to remove header('Location: ...') and the block which grabs the list, wrap it in a function or etract it to another php file to call it with the a simliar ajax-command I used above. And you have to change th $product_list in the while-loop.

Product ID: <div id="$id">$id - <strong>$product_name</strong> - &pound;$price - Stock: $stock - <em>Added $date_added</em> &nbsp; &nbsp; &nbsp; <a href='inventory_edit.php?pid=$id'>edit</a> &bull; <div class="delete">Delete</div></div><br />

jQuery get the id-value of his parent-div. It´s actually not the best way, but something like this should work.

edited Apr 13 '14 at 17:31

answered Apr 13 '14 at 15:06

sydev

115
1
8

Okay but how do i create the validation using javascript/Ajax instead of the PHP validation here. Say you have a list of products on a page with specific id's and a delete button next to it. So when delete is pressed itll remove that particular product. Is this possible? – user3411002 Apr 13 '14 at 15:11
I'm sorry, that isn´t the whole answer to your question. While I´m writing, my comp crashed. I´ll extend it now. – sydev Apr 13 '14 at 17:01
Thanks appreciate it a lot. – user3411002 Apr 13 '14 at 17:06
So do i put these php blocks into a seperate file, and then replace it here and put the script in the head or again a seperate js file and then load it into here. Ill have a fiddle with this code later or tomorrow and post any more issues here. – user3411002 Apr 13 '14 at 17:50
Which pathtophp applies to this code since i have 2 blocks of php. – user3411002 Apr 13 '14 at 17:55
do it. Seperate the files is much tidier and easier to find bugs. – sydev Apr 13 '14 at 17:56
the path to the php file, which contains the mysql-delete-command. But then you have to call another ajax-command to the other php file. So maybe it´s better if you seperate them in functions – sydev Apr 13 '14 at 17:58

Changing PHP function to Javascript/AJAX validation

1 Answers1