Простое модальное окно в jQuery

Я использую SimpleModal в jQuery, и у меня есть одно диалоговое окно подтверждения. Если результат - Yes, я должен вызвать my.php в этом диалоговом окне. Однако я написал код и все еще ищу идеи. Как мне это сделать?

$(document).ready(function () {
    $('#confirmDialog input.confirm, #confirmDialog a.confirm').click(function (e) {
        e.preventDefault();
        // Example of calling the confirm function.
        // You must use a callback function to perform the "yes" action.
        confirm("Continue", function () {
            alert("OK");
        });
    });
});

function confirm(message, callback) {
    $('#confirm').modal({
        close:false,
        position: ["20%",],
        overlayId:'confirmModalOverlay',
        containerId:'confirmModalContainer',
        onShow: function (dialog) {
            dialog.data.find('.message').append(message);

            // If the user clicks "yes"
            dialog.data.find('.yes').click(function () {
                $.get('my.php', function(data){
                    // Create a modal dialog with the data.
                    // Here: How do I write the same window?
                });

                // Call the callback

                // Close the dialog
                $.modal.close();
            });
        }
    });
}

Здесь у меня проблема, как написать это же окно Confirmdialog из результата Ajax. Как мне это сделать?

jquery ajax popup simplemodal

27.12.2008 15:12

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

5 848

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Я не уверен, чего вы пытаетесь достичь - вы пытаетесь повторно использовать модальное диалоговое окно подтверждения для отображения результатов? Я полагаю, вы могли бы это сделать, учитывая, что у вас есть кнопка «закрыть X» в диалоговом окне, просто заменив содержимое сообщения своими результатами и удалив кнопки, чтобы ваш обратный вызов больше не запускался. Это может выглядеть примерно так:

 dialog.data.find('.message').html( 'new contents from your ajax data' );
 dialog,data.find('.buttons').remove();

Однако мне это кажется злоупотреблением модальным диалогом. На мой взгляд, диалог должен содержать только одно взаимодействие с пользователем. Если вам нужно дальнейшее взаимодействие на основе результатов вашего начального диалогового окна, я бы подумал о добавлении еще одного модального диалогового окна, которое вы откроете после закрытия текущего с вашими результатами AJAX, или вставьте результаты AJAX в ваш основной интерфейс и обработайте его там.

27.12.2008 15:56

Ответ принят как подходящий

Я не уверен, что функция подтверждения лучше всего соответствует вашим потребностям, но что-то вроде этого должно работать:

function confirm(message, callback) {
    $('#confirm').modal({
        close:false,
        position: ["20%",],
        overlayId:'confirmModalOverlay',
        containerId:'confirmModalContainer',
        onShow: function (dialog) {
            dialog.data.find('.message').append(message);

            // If the user clicks "yes"
            dialog.data.find('.yes').click(function () {
                $.get("my.php", function (data) {
                    /* Sample response:
                     *   <div id = "title">my title</div>
                     *   <div id = "message">my message</div>
                     *
                     */
                    var resp = $("<div/>").append(data);
                    var title = resp.find("#title").html(),
                        message = resp.find("#message").html();

                    dialog.data.find(".header span").html(title);
                    dialog.data.find(".message").html(message);
                    dialog.data.find(".buttons .yes").hide();
                    dialog.data.find(".buttons .no").html("Close");

                    // No need to call the callback or $.modal.close()
                });
            });
        }
    });
}

Можно ли изменить масштаб нового диалога?

— 29.12.2008 14:08

Вы можете сделать это примерно так: dialog.container.css ({height: "800px", width: "600px"});

— 01.01.2009 07:40

28.12.2008 19:43