The request does not work when I click the delete button, although .success says it worked

Question

I created a model that gets called when I click on delete from the context menu. Then it gives a list of data that I can delete by clicking the button next to them. But for some reason, I can’t understand when the page reloads, nothing is deleted. I added the warning “success” after success in javascript. This warning is triggered, but the data is not deleted. The bootstrap and jQuery bundles are on the index page, which works just fine. This problem was stunned, and if anyone could shed light on it, I would really appreciate it.

This is html:

<div class="modal fade" id="delete_comment" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="form-horizontal" role="form">
        <div class="modal-header">
          <h4>Delete comments</h4>
        </div>
        <div class="modal-body">
          <?php $comment_array = comments::get_comments($username); ?>

          <?php if(isset($comment_array) && is_array($comment_array)): ?>

          <?php
            foreach ($comment_array as $key => $comment):
            foreach($comment as $key2 => $comment2):

            $max = count($comment_array);
            $i=1;

            while($i<=$max):
          ?>

          <?php
            $comment_id = $comment2->id;
            $comment_name = $comment2->comment_name;
            $comment_type = $comment2->comment_type;
          ?>

          <form class="comment_delete_area_wrapper" action="" method="post">
            <div class="comment_delete_wrapper">
              <ul>
                <li class="comment_delete_comments">
                  <?php echo $comment_type ?> : <?php echo $comment_name; ?>
                </li>
              </ul>

              <div class="comment_delete_button_wrapper">
                <input type="submit" id="<?php echo $comment_id; ?>"
                       class="btn btn-danger comment_delete_button" value="Delete"/>
              </div>
              <br>
              <hr>
              <input type="hidden" value="<?php echo $comment_id; ?>"
                     id="comment_delete_id" name="comment_delete_name"/>
            </div>
          </form>
          <?php $i++; ?>
          <?php endwhile;?>
          <?php endforeach; ?>
          <?php endforeach;?>
          <?php endif; ?>
        </div>

        <div class="modal-footer">
          <a class="btn btn-default" data-dismiss="modal">Close</a>
        </div>
      </div>
    </div>
  </div>
</div>

And here is the PHP code for the classes. All comments are taken from the database and look perfect. The problem is removing them.

<?php

class Comments{

    public static function delete($cl_id)
{


    $db = new PDO('mysql:host=localhost;dbname=comment;charset=utf8', 'root', '');
    $stmt = $db->prepare("DELETE FROM `comments` WHERE id = :cl_id");

    $stmt->bindParam(':cl_id', $cl_id);
    if ($stmt->execute()) {
        return true;
    } else {
        return null;
    }
}

}

And javascript:

$(document).ready(function(){
add_delete_handlers();
});

function add_delete_handlers(){
$('.comment_delete_button').each(function(){
    var btn = this;
    $(btn).click(function(){

        comment_delete(btn.id);

    });
});
}

function comment_delete(_comment_id){

$.post('comment_area_ajax/comment_delete.php', {
        task: 'comment_delete',
        comment_id: _comment_id
    }
).success(function(data){
        alert('Success');
        $('#_' + _comment_id).detach();
    });

 }

, , , AJAX:

<?php
if(isset($_POST['task']) && $_POST['task'] =='comment_delete') {
require_once '../comment_area_sql/models/comment_delete_model.php';
require_once '../comment_area_sql/models/comments.php';

    if(class_exists('Comments')){

          if(Comments::delete($_POST['comment_id'])){
                echo 'true';
}else{
                echo 'false';
}

?>

Answer 1

:

$(document).ready(function() {
    add_delete_handlers();
});

function add_delete_handlers() {
    $('.comment_delete_button').click(function() {
        comment_delete($('this').attr('id'));
    });
}

function comment_delete(_comment_id) {
    $.post('comment_area_ajax/comment_delete.php', {
        task: 'comment_delete',
        comment_id: _comment_id
    }, function(data) {
        alert('Success');
        $('#_' + _comment_id).detach();
    });
}

ajaxed :

<?php
    if(isset($_POST['task']) && $_POST['task'] =='comment_delete') {
        require_once '../comment_area_sql/models/comment_delete_model.php';
        require_once '../comment_area_sql/models/comments.php';
        if(class_exists('Comments')){
            if(Comments::delete($_POST['comment_id'])){//note the change
                $message = 'comment deleted';
            }else{
                $message = 'we have a error';
            }
           return json_encode(array('message'=>$message));
        }
    }
?>