jQuery: возникают проблемы при выборе / действии на родительском элементе - PullRequest
Новая
       11

jQuery: возникают проблемы при выборе / действии на родительском элементе

0 голосов
/ 28 апреля 2011

Я впервые играю с jQuery и AJAX и, кажется, натолкнулся на небольшой камень преткновения при попытке удалить запись из базы данных. Или, чтобы быть более понятным, элемент удаляется из базы данных успешно, но я не могу выбрать правильный элемент, чтобы скрыть его после удаления.

Вот как выглядит пример кода (в данном случае я просто пытаюсь изменить цвет фона для целей тестирования: я буду использовать fadeOut или эквивалент в моей производственной среде - более подробное объяснение приведено ниже): 

    //When link with class .deleter is clicked, get the parent element's id (which is also that element's id in the database)
    $('.deleter').click(function() {
        var recordToDelete = $(this).closest('ul').attr('id');

    //Send the id to the PHP script, which returns 1 if successful and 0 if not
        $.post("databasefuncs.php?func=delete", { postedMessage : recordToDelete },
            function(result){
                if(result == 1) {
                    //Change the background color of the parent UL to red if successful
                    $(this).closest('ul').css('background-color', 'red');
                } else {
                    //Change the background color of the parent UL to blue if successful
                    $(this).closest('ul').css('background-color', 'blue');
                }

            });
    });

Чтобы уточнить, как это выглядит на внешнем интерфейсе, мои UL настроены на отображение: table-row, мои LI настроены на отображение: table-cell, и у меня есть DIV, который содержит их все и установлен на дисплей: таблица. По сути, у меня есть UL на запись и LI на столбец в каждой записи.

Спасибо!

1 Ответ

0 голосов
/ 28 апреля 2011

У вас другой контекст внутри обратного вызова AJAX.Таким образом, $ (this) указывает на другой объект.Я предлагаю вам использовать closure - переменная "item" в следующем примере: 

//When link with class .deleter is clicked, get the parent element's id (which is also that element's id in the database)
$('.deleter').click(function() {
    var item = $(this).closest('ul');
    var recordToDelete = item.attr('id');

//Send the id to the PHP script, which returns 1 if successful and 0 if not
    $.post("databasefuncs.php?func=delete", { postedMessage : recordToDelete },
        function(result){
            if(result == 1) {
                //Change the background color of the parent UL to red if successful
                item.css('background-color', 'red');
            } else {
                //Change the background color of the parent UL to blue if successful
                item.css('background-color', 'blue');
            }

        });
});
...