Wednesday, October 4, 2017

Modal is not showing in angularjs

HTML for modal

<div id="popup-mpdal" style="display:none;">
        <div class="block QuoteWrapper">
            <form class="form subscribe" method="post">
                <div class="control">
                    <b>Full Name<span class="mandantory">*</span></b>
                    <input type="text" placeholder="Full Name" />
                </div>
                <div class="control">
                    <b>Email Address<span class="mandantory">*</span></b>
                    <input type="email" placeholder="Email Address" />
                </div>
                <div class="control">
                    <b>Contact Number<span class="mandantory">*</span></b>
                    <input type="number" placeholder="Contact Number" />
                </div>
                <div class="control">
                    <b>Comments</b>
                    <textarea rows="2" cols="50" placeholder="Comments"></textarea>
                </div>
                <div class="clearfix"></div>
                <div class="text-center">
                    <div class="primary">
                        <button class="action login login1 primary">
                            <span>Submit</span>
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>

This is html for modal. I have added js to call this modal.

JS for modal

 require(['jquery', 'Magento_Ui/js/modal/modal'], function($, modal) {
    var options = {
        type: 'popup',
        title: 'Request for Quote',
        responsive: true,
        innerScroll: true,
        modalClass: 'RQuoteModal',
        clickableOverlay: true,
    };
    var popup = modal(options, $('#popup-mpdal'));
    $(".RequestQuote").on('click', function() {
        $("#popup-mpdal").modal({
            clickableOverlay: true
        }).modal("openModal");
    });

I have this script for modal. But its not working in angularjs. I need to know how to define it withing controller of page.

Source: AngularJS



from Angular Questions https://angularquestions.com/2017/10/04/modal-is-not-showing-in-angularjs/
via @lzomedia #developer #freelance #web #lzomedia.com

No comments:

Post a Comment