JQuery, добавление динамического контента, почему в итоге отображается не всё?

Question

[DarkDiabolik]

Здравствуйте, проблема такая:

Получаю через ajax строчку вида '[e-mail]Лишить доступа';
Добавляю её с помощью .append.

В исходном коде она присутствует, но в "Проинспектировать элемент" (Google Chrome) присутствует только "[e-mail]Лишить доступа". Самое главное, мне потом ещё потребуется работа с "", а jquery его не видит.

С чем связано такое поведение?

Comments

[Alexey]

Не очень понятно, в итоге должно быть так "'[e-mail]Лишить доступа';"?
И каким образом вы понимаете, что jquery его не видит, попробуйте в консоли $('#id_element').

[DarkDiabolik]

Простите:
Изначальная строчка :

<tr><input type="hidden" id="UID" value="123123123123"><td>[e-mail]</td><td align="center"><button id="del_user">Лишить доступа</button></td></tr>';

То что находится в Происпектировать Элемент

<td>[e-mail]</td><td align="center"><button id="del_user">Лишить доступа</button></td>

Answer 1

[Юрий Лобанов]

Кавычки что ли удаляет?

строчку вида '[e-mail]Лишить доступа'

присутствует только "[e-mail]Лишить доступа"

А то я не вижу отличия!

работа с ""

- это вообще что такое?

Answer 2

[Юрий Лобанов]

<tr><input type="hidden" id="UID" value="123123123123"><td>[e-mail]</td><td align="center"><button id="del_user">Лишить доступа</button></td></tr>

Почему вы вставляете что-то в строку tr без ячейки td, пусть и скрытое поле? Вставляйте уж тогда прямо в ячейку td

<tr><td><input type="hidden" id="UID" value="123123123123">[e-mail]</td><td align="center"><button id="del_user">Лишить доступа</button></td></tr>

В исходном коде Вам показано все мракобесие, которое Вы написали, а инспектор кода в хроме показывает исправленный вариант, он Ваш инпут скорее всего просто как ошибку пропускает.

Возможно, в Проинспектировать элемент Вы смотрите только на ячейку? Ведь там все разбивает по строка, наверное выглядит так:
tr
input
td
td
/tr
Должно по крайней мере так. А вот почему не работают элементы новые - это уже вопрос к тому, как Вы навешиваете события. Или используйте live или on, или при append навешивайте события по новой.

Answer 3

[DarkDiabolik]

Изначально добавленные строки(Не с помощью append, а через php) записываются также. И с ними никаких проблем нету в обработке. А с динамическими происходит, именно то что я пишу.

Comments

[Юрий Лобанов]

@DarkDiabolik можете кинуть ссылку на сайт?

[Юрий Лобанов]

@DarkDiabolik Вы меня смутили своим рассказом о Проинспектировать элемент. Дополнил свой ответ.

Answer 4

[Alexey]

А как вы jquery событие вешаете? если через .click() то оно не будет работать с добавленными динамически элементами.
Ппробуйте так:

$("#del_user").on("click", function(event){
    alert('1');
});

Answer 5

[DarkDiabolik]

$(document).on("click", "button#del_user",function(event) {
                alert("1");
                currentid = event.target;
                var request = $.ajax({
                    url : "http://",
                    type: "POST",
                    data: {del_user : $(event.target).closest("tr").find("input").attr("value")},
                    datatype:"html"
                });
                request.done(function(data) {
                    alert(data);
                    $(event.target).closest("tr").remove();                                  
                });
                request.fail(function(data) {
                    alert("По неизвестной причине не удалось выполнить удаление;");
                });
            });

Этот код работает с изначальными данными, но те которые добавились позже(append), просто при нажатие на кнопку, удаляется чуть ли не вся страница. Видимо closest("tr") отрабатывает не т.к как надо из-за того, что который он должен находить, его попросту нету.

Comments

[Alexey]

@DarkDiabolik покажите js код который добавляет данные

Answer 6

[maxaon]

Для начала сделайте правильную разметку, и только потом задавайте вопросы. Проверьте абсолютно весь свой код.
Я согласен с @iiil. Сделайте свой код корректным. Заодно проверьте его в валидаторе