Отправить значение с помощью Javascript

Question

Я немного застрял со следующей функцией. Пожалуйста, обратите внимание, я абсолютный новичок с javascript / ajax, поэтому, пожалуйста, держитесь за меня:

<script type="text/javascript">
function removeElement($parentDiv, $childDiv){


     if (document.getElementById($childDiv)) {    
          var child = document.getElementById($childDiv);
          var parent = document.getElementById($parentDiv);
          parent.removeChild($child);
     }
}
</script>

<a href=\"javascript:;\" onClick=\"removeElement('$parent','$child');\">x</a>

Эта функция удаляет дочерний элемент и его содержимое, что прекрасно работает на стороне клиента! Но я хочу передать значение серверу, в том же случае, чтобы содержимое элемента также можно было удалить из базы данных mysql. Я понятия не имею, как это сделать, поэтому любые предложения будут очень благодарны!

Примечания: $ child и $ parent - это строки, сгенерированные в файле php, которые я использую для присвоения каждому элементу уникального идентификатора.

Answer 1

Чтобы сделать вашу жизнь проще, используйте jQuery или аналогичные фреймворки. Вот как бы вы сделали это в jQuery:

$(function() {
    $('.delete').click(function() {
        var link = $(this);
        var id = link.attr('id').replace('element_', '');
        $.ajax({
            url: 'handler.php',
            data: {
                element: id
            },
            type: 'post',
            success: function() {
                link.remove();
                // Or link.closest('tr').remove() if you want to remove a table row where this link is
            }
        });
        return false;
    });
});

HTML:

<a href="#" class="delete" id="element_20">Remove</a>

И handler.php:

mysql_query("DELETE FROM `table` WHERE id = '".mysql_real_escape_string($_POST['element'])."'");

Всегда помните, чтобы избежать ввода базы данных!

Если вы, как вы сказали, абсолютный новичок, вы, вероятно, не поймете всего этого, поэтому я предлагаю вам прочитать кое-что о возможностях jJuery AJAX и об общей разработке с использованием jQuery или аналогичной инфраструктуры JavaScript.

Answer 2

Когда вы вызываете функцию, вы захотите поместить переменные PHP в теги, например:

<?php echo $parent; ?>

и

<?php echo $child; ?>

В определении функции вы захотите избавиться от переменных стиля PHP и использовать что-то вроде:

function removeElement(parentDiv, childDiv) { //CODE }

Answer 3

Допустим, я хочу удалить объект, используя идентификатор

JQUERY - $ .post () Это простой способ отправить простой запрос POST на сервер без использования более сложной функции $ .ajax. Это позволяет указать одну функцию обратного вызова, которая будет выполняться, когда запрос будет завершен (и только если ответ имеет успешный код ответа). JQuery Post Docs

На сервере, если у вас есть открытое соединение с базой данных.

mysql_query ("УДАЛИТЬ ИЗ ТАБЛИЦЫ, ГДЕ ID =". $ _ POST ['ID']);

больше в mysql_query найдено здесь

EDIT:

Таким образом, следующий элемент будет удален только после завершения публикации ajax. Обратите внимание, что первый аргумент - это URL-адрес скрипта, который будет выполнять действие, второй - данные, которые будут отправлены, в этом случае значение идентификатора будет равно {child.id}, а третье - это встроенная функция обратного вызова, которая будет принимать действие по удалению элемента на стороне клиента.

<script type="text/javascript">
function removeElement($parentDiv, $childDiv){
if (document.getElementById($childDiv)) {
          var child = document.getElementById($childDiv);
          var parent = document.getElementById($parentDiv);  
          $.post('{URLTOSCRIPT}', 'ID=$child.id',function () { parent.removeChild($child); });

}}
</script>