Выполнение файла PHP из запроса jQuery/AJAX

Question

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

Я бы хотел, чтобы эта функция работала без обновления страницы, но, похоже, я не могу получить часть jQuery/AJAX? Ничего не происходит.

Как новичок jQuery, я надеялся, что кто-то может указать на линию, на которую мне придется смотреть?

A HREF, которая должна быть нажата, чтобы удалить строку:

for (var i in json.lines) { 
    lines.push("[<a class='delete' href='#' data-lineID='" + json.lines[i].id + "'>x</a>] " + json.lines[i].user + json.lines[i].divide + " " + json.lines[i].message); 
} 

JQuery:

$('a.delete').on('click', function(event) { 
var id = $(this).data('lineID'); 

    /* Request to .php file */ 
    var request = $.ajax({ 
    url: "/communications/chat.php?page=delete", 
    type: "POST", 
    data: { id : id }, 
    dataType: "html" 
    }); 

    event.preventDefault(); 
    return false; 

});

Часть PHP скрипт для выполнения:

case 'delete' : 

if(isset($_POST['id']) && !empty($_POST['id'])) { 
    $id = $_POST['id']; 

    try { 
     $query = $udb->prepare("UPDATE `chat_lines` SET `deleted` = '1' WHERE `id` = ?"); 
     $query->bindValue(1,$id); 
     $query->execute(); 
    } catch (Exception $e) { 
     die($e->getMessage()); 
    } 
} 

break; 

Любая помощь приветствуется :)

Answer 1

Это может быть длинный выстрел, но я думаю, что ваша проблема вызвана HTML элемента не будучи там, когда вы загружаете Javascript.
jQuery будет прикреплять прослушиватель событий (в данном случае click) при загрузке сценария.
Если элемент добавлен после сценарий загружается, слушатель не подключен, поэтому он не запускает ваш код.

Что вам нужно сделать, это использовать event delegation. Это означает, что вы должны изменить свой яваскрипта кода следующим образом:

$('#mainContainerOfYourChat').on('click', 'a.delete', function(event) { 
    var id = $(this).data('lineID'); 

    /* Request to .php file */ 
    var request = $.ajax({ 
      url: "/communications/chat.php?page=delete", 
      type: "POST", 
      data: { id : id }, 
      dataType: "html" 
     }); 

    event.preventDefault(); 
    return false; 
}); 

Таким образом, JQuery будет слушать основную емкость вашей страницы, когда щелчок обжигало, если он соответствует селектору a.delete, она будет срабатывать ваш код.

Answer 2

Если РНР удаление сообщения из БД вашей единственной проблемой является то остается загружен на стороне клиента пока вы не перезагрузите страницу. Если это так вам нужно всего лишь включить строку, чтобы удалить комментарий, если Аякса вызов успешен:

var request = $.ajax({ 
    url: "/communications/chat.php?page=delete", 
    type: "POST", 
    data: { id : id }, 
    dataType: "html", 
    success: function(){ 
     $("a.delete[data-lineID="+id+"]").parent().remove(); 
    } 
    });