1

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;
                });
            };
        });
4

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;
        });
    };
});
  • Vah jiga vah +1 from me.... – Prince Patel Dec 28 '17 at 5:48
  • Wah jiga +1 from me :) – Keyur Shah Dec 28 '17 at 8:00
3

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");
}
  • Right answer. its working properly. – Dhaduk Mitesh Sep 28 '18 at 9:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.