Отправка данных из формы CakePHP, встроенной в диалог Jquery, с помощью диалоговой кнопки - PullRequest
0 голосов
/ 09 декабря 2010

У меня есть проблема, которую я не могу понять за свою жизнь. У меня есть представление функции 'add', встроенное в модальное диалоговое окно jquery, в котором есть 2 кнопки: отправить и отменить. Я загружаю представление через ajax в div, и когда представление завершается, я запускаю диалоговое окно. до сих пор все работает нормально. моя проблема в том, как отправить данные формы при нажатии кнопки отправки в диалоговом окне jquery?

    $('#addUser').dialog({
                         autoOpen: false,
                         modal: true,
                         title: "Add new user",
                         resizable: false,
                         width: 370,
                         height: 350,
                         buttons: {
                            "Add user": function() {
                                //$("#addUser").html("Updating data...");
                                //$.ajax({
//                                    async:true,
//                                    type: 'post',
//                                    url:'/users/add',
//                                    data: $(this).parents('form:first').serialize(),
//                                    success: function (response){
//                                        $('#addUser').empty().html(response);
//                                    }
//                                })
                               //this part triggers a hidden submit button
                                $('#Submit').trigger('click');
                                $(this).dialog("close");
                            },
                             "Close": function() {
                                 $(this).dialog("close");
                             }
                         }
       });

$('#Submit').trigger('click'); 

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

Может кто-нибудь помочь мне хотя бы с другой идеей?

Обновление:

Спасибо, Иш Кумар, за быстрый ответ. Я попробовал этот сценарий, если вы заметили закомментированную часть .ajax {}, но я не получаю никаких данных в контроллере, а также часть успеха никогда не выполняется. Насколько я понял, триггер (щелчок) - единственный способ получить данные для контроллера, но проблема здесь в том, что вместо изменения div на главной странице, которая открывает диалоговое окно, он перенаправляет меня на вид действия, в моем случае «index» .. Я только учусь CakePHP, и я уверен, что есть кое-что, что мне не хватает ... знаете ли вы какие-либо учебные пособия, которые могут указать мне в правильном направлении или вы можете предоставить мне код в контроллере, который может достичь этого? Буду очень признателен.

Я пытаюсь добиться этого: на главной странице у меня есть список всех пользователей, внизу списка есть ссылка для добавления нового пользователя. Форма для нового пользователя Я хочу открыть его в диалоге jquery. В диалоговом окне у меня также есть две кнопки - отправить и отменить. Эти кнопки являются диалоговыми кнопками jquery, как в примере формы на странице jquery. При нажатии кнопки «Отправить» я хочу отправить данные из формы в контроллер в действии добавления. Когда действие добавления завершено, я хочу обновить свой список пользователей на главной странице без перезагрузки страницы.

спасибо заранее, денис

1 Ответ

0 голосов
/ 09 декабря 2010

Вы должны return false после нажатия, чтобы избежать отправки формы дважды. Попробуйте переопределить событие отправки формы, как показано ниже

$('#MyForm').submit(function () {
   $.ajax({      // <-- this is your casual ajax request
         url: '/echo/jsonp',
         data : $('#MyForm').serialize(), 
         success : function(data) {
             alert(data);
         }
    });
    return false; // <-- this should stop redirection
});

Демо: http://jsfiddle.net/hMTKv/

Таким образом, каждый раз, когда вы запускаете отправку, ajax-запрос инициируется без перенаправления.

...