Pergunta

I need to close the popup modal in magento 2, In my js I have given button as false, I can open the popup, but falied to close it after showing the response messagePlease provide me a solution to close popup modal after showing the response message Js for reference

function ($) {
            "use strict";
            // Review form 
            var x = {
                type: 'popup',
                responsive: true,
                innerScroll: true,
                buttons: false,
                title: "Header contant",
                modalClass: "popup-center abc-product-review",
                clickableOverlay: true,
                heightStyle: "content"
            };
            var a = $('#review-form-content-wrapper').modal(x);
            $(".add-your-review").click(function () {
                var status = $(this).attr('data-status');
                if (status === 'logged in')
                    a.modal("openModal");
                else
                    alert("Please loggin");
            });
return function (config) {
                $('#review-form').on("click", "#review-submit", function () {
                    var form_data = $("#review-form").serialize();
                    var reviewurl = config.url;
                    $.ajax({
                        url: reviewurl,
                        type: 'POST',
                        // Pass the submitted form data to Controller
                        data: form_data,
                        success: function (response) {

                            var returnedData = JSON.parse(response);
                            if (returnedData.status === 'success')
                                $("#success").html(returnedData.messages);
                            else
                                $("#error").html(returnedData.messages);
                        },
                        error: function (response) {
                            var returnedData = JSON.parse(response);
                            $("#error").html(returnedData.messages);
                        }
                    });
                    return false;
                });
            };
        });
Foi útil?

Solução

To close popup model there is method closeModal().

Updated code:

function ($) {
    "use strict";
    // Review form 
    var x = {
        type: 'popup',
        responsive: true,
        innerScroll: true,
        buttons: false,
        title: "Header contant",
        modalClass: "popup-center abc-product-review",
        clickableOverlay: true,
        heightStyle: "content"
    };
    var a = $('#review-form-content-wrapper').modal(x);
    $(".add-your-review").click(function () {
        var status = $(this).attr('data-status');
        if (status === 'logged in')
            a.modal("openModal");
        else
            alert("Please loggin");
    });
return function (config) {
        $('#review-form').on("click", "#review-submit", function () {
            var form_data = $("#review-form").serialize();
            var reviewurl = config.url;
            $.ajax({
                url: reviewurl,
                type: 'POST',
                // Pass the submitted form data to Controller
                data: form_data,
                success: function (response) {

                    var returnedData = JSON.parse(response);
                    if (returnedData.status === 'success')
                        $("#success").html(returnedData.messages);
                    else
                        $("#error").html(returnedData.messages);
                },
                error: function (response) {
                    var returnedData = JSON.parse(response);
                    $("#error").html(returnedData.messages);
                    a.closeModal();
                }
            });
            return false;
        });
    };
});

Outras dicas

After you get success response you can simply a.modal("closeModal"); to close your modal.

For Example

success: function (response) {

    var returnedData = JSON.parse(response);
    if (returnedData.status === 'success')
        $("#success").html(returnedData.messages);
    else
        $("#error").html(returnedData.messages);

    a.modal("closeModal");
}
Licenciado em: CC-BY-SA com atribuição
Não afiliado a magento.stackexchange
scroll top