1

I have created custom link using popup modal. I need to placed this link in My Account page->My Orders and next to Reorder link. Like below enter image description here

While clicking cancel it shows an popup window which consist text area and submit button. While clicking submit,It should save in DB. I have written code, in my Controller file to save the message in DB, But I don't know where I need to give the submit url in below file. Please provide me a solution.

Thanks in advance

history.phtml

<div>
                                <a href="#" class="click-me">Cancel</a>
                            </div>

                            <div id="popup-modal" style="display:none;">
                                <textarea>
                                </textarea>
                            </div>
                            <script>
                                require(
                                        [
                                            'jquery',
                                            'Magento_Ui/js/modal/modal'
                                        ],
                                        function (
                                                $,
                                                modal
                                                ) {
                                            var options = {
                                                type: 'popup',
                                                responsive: true,
                                                innerScroll: true,
                                                title: 'Reason for Cancelled the item',
                                                buttons: [{
                                                        text: $.mage.__('submit'),
                                                        class: '',
                                                        click: function () {
                                                            this.closeModal();
                                                        }
                                                    }]
                                            };

                                            var popup = modal(options, $('#popup-modal'));
                                            $(".click-me").on('click', function () {
                                                $("#popup-modal").modal("openModal");
                                            });

                                        }
                                );
                            </script>

Controller

<?php

/*
 * To change this license header, choose License Headers in Project Properties.
 * To change this template file, choose Tools | Templates
 * and open the template in the editor.
 */

namespace XXX\SalesOrder\Controller\Index;

use Magento\Framework\App\Action\Action;
use Magento\Sales\Model\Order;

//use Magento\Framework\Controller\ResultFactory;

class Index extends Action
{

    protected $_resultPageFactory;
    protected $order;

    public function __construct(
    \Magento\Framework\App\Action\Context $context, Order $order, \Magento\Framework\View\Result\PageFactory $resultPageFactory
    )
    {
        $this->_resultPageFactory = $resultPageFactory;
        $this->order = $order;
        parent::__construct($context);
    }

    public function execute()
    {
        $orderId = 3;
        $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
        $order = $objectManager->create('\Magento\Sales\Model\Order')->load($orderId);
        $order->addStatusHistoryComment('I need to get message here');// I need to get textarea message here
        $orderState = Order::STATE_PROCESSING;
        $order->setState($orderState)->setStatus(Order::STATE_PROCESSING);
        $order->save();

        $resultPage = $this->_resultPageFactory->create();
        return $resultPage;
    }

}

1 Answer 1

3

Create <form> inside popup-modal div

<div>
    <a href="#" class="click-me">Cancel</a>
</div>

<div id="popup-modal" style="display:none;">
      <form action="<?php  echo $block->getBaseUrl() . 'frontname/controllername/actionname';?>" method="post" id="form-validate" enctype="multipart/form-data" autocomplete="off" data-mage-init='{"validation":{}}' data-hasrequired="<?php /* @escapeNotVerified */ echo __('* Required Fields') ?>">
                <textarea id="reason" name="reason"></textarea>
      </form>
</div>

JS Code

<script>
    require(
        [
            'jquery',
            'Magento_Ui/js/modal/modal'
        ],
        function(
            $,
            modal
        ) {
            var options = {
                type: 'popup',
                responsive: true,
                //innerScroll: true,
                title: 'Reason for Cancelled the item',
                buttons: [{
                    text: $.mage.__('submit'),
                    class: '',
                    click: function(data) {

                        var form_data = jQuery("#form-validate").serialize();


                        console.log(form_data);
                        jQuery.ajax({
                            url: "<?php  echo $block->getBaseUrl() . 'frontname/controllername/actionname';?>",
                            type: 'POST',
                            data: form_data,
                            success: function(data) {

                                console.log(data);
                            },
                            error: function(result) {
                                console.log('no response !');
                            }
                        });

                        this.closeModal();

                    }
                }]
            };

            var popup = modal(options, $('#popup-modal'));
            $(".click-me").on('click', function() {
                $("#popup-modal").modal("openModal");
            });

        }
    );
</script>
7
  • Thank you for your response, I have updated my post, see that.. In my Block I have mentioned the getSaleCollection function , then How do i call getBaseUrl function ?? Because I did not mention any function like getBaseUrl... Please Explain
    – Jaisa
    Nov 27, 2017 at 4:28
  • getBaseUrl() function is core function which can be used in any phtml file so no need to define in you block
    – mansi
    Nov 27, 2017 at 5:03
  • I have added my controller file . But while clicking submit it is failed to hit controller . see the updated post
    – Jaisa
    Nov 27, 2017 at 5:25
  • add like this in form action and ajax call <?php echo $block->getBaseUrl() . 'frontname/index/index';?> change frontname with your frontname
    – mansi
    Nov 27, 2017 at 5:31
  • Thank you, It works good, But i need to get text area message in addStatusHistoryComment in my controller... Any idea about it
    – Jaisa
    Nov 27, 2017 at 7:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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