Переменные не обновляются после выполнения запроса AJAX - PullRequest
0 голосов
/ 01 марта 2011

У меня есть сетка «объектов» на странице.Например:

obj1, obj2, obj3, ...

Каждый объект имеет опцию «Редактировать», которая открывает модальное окно (ui.dialog) и загружает (.load ()) шаблон, где находятся некоторые входные данные, текстовые поля и т. д. для редактирования информации об объекте.Есть кнопка «Завершить редактирование», которая отправляет запрос POST в файл PHP через AJAX .post ().После этого информация об объекте должна быть отредактирована.

Нет проблем с PHP или MySQL, проблема только в JS.После первого обновления все выглядит нормально, но когда я нажимаю на 'obj2', чтобы отредактировать его, и нажимаю 'Завершить редактирование', переменные, в которые я записал входные значения, взяты из предыдущей операции.

obj1.var1 = 'text1';var2 = 'text2';

obj2.var1 = 'text3';var2 = 'text4';

Например, в 'obj1' я отправил следующие данные: 'v1': var1, 'v2': var2.Все нормально.Но в 'obj2' он также отправил 'text1' и 'text2', а не 'text3' и 'text4'.

Я сделал var1.val (''), но это не помогло,второй раз он отправил пустое значение:)

Код:

$(".edit").click(function(){
    var modal = $('<div class="dialog" id="dialog-new-message"><div></div></div>');
    modal.dialog({
        modal: true,
        width: 300,
        height: 300,
        autoOpen: true
    });

    modal.find(">div").load('someurl', function(){
        modal.dialog('open');
        modal.find("#finish-button").click(function() {
            var var1 = $('#someid1').val();
            var var2 = $('#someid2').val();
            $.ajax({
                url: 'someurl',
                type: 'post',
                data: {
                    'v1' : var1,
                    'v2' : var2
                },
                success: function(data) {
                    modal.dialog('close');
                    // here is some refresh code to refresh the edited info in the page ... nothing serious
                }
            });
        });
    });
});

1 Ответ

0 голосов
/ 01 марта 2011

Я думаю, проблема в том, что вы воссоздаете диалог, но не уничтожаете старый.Вероятно, он получает значения из первого созданного вами.Попробуйте добавить функцию обратного вызова close к функции modal.dialog(), которая удаляет div следующим образом:

modal.dialog({
    modal: true,
    width: 300,
    height: 300,
    autoOpen: true
    close: function() { modal.remove(); } //$(this).remove(); Might also work.
});

Это должно удалить ваш оригинальный div, чтобы в следующий раз, когда модальное диалоговое окно было открыто, идентификаторы внутри него все ещеуникальный.

Вы можете убедиться, что это происходит, используя инструменты вашего браузера и проверив, как выглядит DOM после запуска второго.

Редактировать
Другой вариант - сохранить диалог в глобальной переменной, а затем проверить, определено ли оно еще.Если это не делает то, что вы делаете.Если это так, установите переменную, чтобы сообщить ей, какой идентификатор элемента, который вы редактируете, и сбросьте все текстовые поля на пустые, прежде чем снова запускать .dialog("open");.

...