Create di.xml at app/code/Magemonkeys/AjaxNewsletter/etc/di.xml folder.

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Newsletter\Controller\Subscriber\NewAction">
        <plugin name="Newsletter_Subscriber_NewAction"
                type="Magemonkeys\AjaxNewsletter\Controller\Plugin\Subscriber\NewAction" sortOrder="10" disabled="false" />
    </type>
</config>

<?xml version="1.0"?>

<plugin name="Newsletter_Subscriber_NewAction"

type="Magemonkeys\AjaxNewsletter\Controller\Plugin\Subscriber\NewAction" sortOrder="10" disabled="false" />

</type>

</config>

create NewAction.php at app/code/Magemonkeys/AjaxNewsletter/Controller/Plugin/Subscriber folder

<?php
/**
 *
 */
namespace Magemonkeys\AjaxNewsletter\Controller\Plugin\Subscriber;
 
use Magento\Customer\Api\AccountManagementInterface as CustomerAccountManagement;
use Magento\Customer\Model\Session;
use Magento\Customer\Model\Url as CustomerUrl;
use Magento\Framework\App\Action\Context;
use Magento\Store\Model\StoreManagerInterface;
use Magento\Newsletter\Model\SubscriberFactory;
 
/**
 * Class NewAction
 */
class NewAction extends \Magento\Newsletter\Controller\Subscriber\NewAction
{
    /**
     * @var CustomerAccountManagement
     */
    protected $customerAccountManagement;
 
    protected $resultJsonFactory;
 
    /**
     * Initialize dependencies.
     *
     * @param Context $context
     * @param SubscriberFactory $subscriberFactory
     * @param Session $customerSession
     * @param StoreManagerInterface $storeManager
     * @param CustomerUrl $customerUrl
     * @param CustomerAccountManagement $customerAccountManagement
     */
    public function __construct(
        Context $context,
        SubscriberFactory $subscriberFactory,
        Session $customerSession,
        StoreManagerInterface $storeManager,
        CustomerUrl $customerUrl,
        CustomerAccountManagement $customerAccountManagement,
        \Magento\Framework\Controller\Result\JsonFactory $resultJsonFactory
    ) {
        $this->customerAccountManagement = $customerAccountManagement;
        $this->resultJsonFactory = $resultJsonFactory;
        parent::__construct(
            $context,
            $subscriberFactory,
            $customerSession,
            $storeManager,
            $customerUrl,
            $customerAccountManagement
        );
    }
 
    /**
     * Retrieve available Order fields list
     *
     * @return array
     */
    public function aroundExecute($subject, $procede)
    {
        $response = [];
        if ($this->getRequest()->isPost() && $this->getRequest()->getPost('email')) {
            $email = (string)$this->getRequest()->getPost('email');
 
            try {
                $this->validateEmailFormat($email);
                $this->validateGuestSubscription();
                $this->validateEmailAvailable($email);
 
                $status = $this->_subscriberFactory->create()->subscribe($email);
                if ($status == \Magento\Newsletter\Model\Subscriber::STATUS_NOT_ACTIVE) {
                    $response = [
                        'status' => 'OK',
                        'msg' => 'The confirmation request has been sent.',
                    ];
                } else {
                    $response = [
                        'status' => 'OK',
                        'msg' => 'Thank you for your subscription.',
                    ];
                }
            } catch (\Magento\Framework\Exception\LocalizedException $e) {
                $response = [
                    'status' => 'ERROR',
                    'msg' => __('There was a problem with the subscription: %1', $e->getMessage()),
                ];
            } catch (\Exception $e) {
                $response = [
                    'status' => 'ERROR',
                    'msg' => __('Something went wrong with the subscription.'),
                ];
            }
        }
 
        return $this->resultJsonFactory->create()->setData($response);
    }
 
}

100

101

<?php

/**

namespace Magemonkeys\AjaxNewsletter\Controller\Plugin\Subscriber;

use Magento\Customer\Api\AccountManagementInterface as CustomerAccountManagement;

use Magento\Customer\Model\Session;

use Magento\Customer\Model\Url as CustomerUrl;

use Magento\Framework\App\Action\Context;

use Magento\Store\Model\StoreManagerInterface;

use Magento\Newsletter\Model\SubscriberFactory;

/**

* Class NewAction

class NewAction extends \Magento\Newsletter\Controller\Subscriber\NewAction

{

/**

* @var CustomerAccountManagement

protected $customerAccountManagement;

protected $resultJsonFactory;

/**

* Initialize dependencies.

* @param Context $context

* @param SubscriberFactory $subscriberFactory

* @param Session $customerSession

* @param StoreManagerInterface $storeManager

* @param CustomerUrl $customerUrl

* @param CustomerAccountManagement $customerAccountManagement

public function __construct(

Context $context,

SubscriberFactory $subscriberFactory,

Session $customerSession,

StoreManagerInterface $storeManager,

CustomerUrl $customerUrl,

CustomerAccountManagement $customerAccountManagement,

\Magento\Framework\Controller\Result\JsonFactory $resultJsonFactory

) {

$this->customerAccountManagement = $customerAccountManagement;

$this->resultJsonFactory = $resultJsonFactory;

parent::__construct(

$context,

$subscriberFactory,

$customerSession,

$storeManager,

$customerUrl,

$customerAccountManagement

);

}

/**

* Retrieve available Order fields list

* @return array

public function aroundExecute($subject, $procede)

{

$response = [];

if ($this->getRequest()->isPost() && $this->getRequest()->getPost('email')) {

$email = (string)$this->getRequest()->getPost('email');

try {

$this->validateEmailFormat($email);

$this->validateGuestSubscription();

$this->validateEmailAvailable($email);

$status = $this->_subscriberFactory->create()->subscribe($email);

if ($status == \Magento\Newsletter\Model\Subscriber::STATUS_NOT_ACTIVE) {

$response = [

'status' => 'OK',

'msg' => 'The confirmation request has been sent.',

];

} else {

$response = [

'status' => 'OK',

'msg' => 'Thank you for your subscription.',

];

}

} catch (\Magento\Framework\Exception\LocalizedException $e) {

$response = [

'status' => 'ERROR',

'msg' => __('There was a problem with the subscription: %1', $e->getMessage()),

];

} catch (\Exception $e) {

$response = [

'status' => 'ERROR',

'msg' => __('Something went wrong with the subscription.'),

];

}

return $this->resultJsonFactory->create()->setData($response);

}

Make a copy of “vendor/magento/module-newsletter/view/frontend/templates/subscribe.phtml” and place it inside your Magento Theme (e.g. app/design/frontend/NAMESPACE/MY_CUSTOM_THEME/Magento_Newsletter/templates/subscribe.phtml
Add the following javascript to the end of the subscribe.phtml:

{ "*": { "js/newsletter_subscriber_ajax": { } } }

1
2
3
4
5

{
        "*": {
            "js/newsletter_subscriber_ajax": { }
        }
    }
Create newsletter_subscriber_ajax.js at app/design/frontend/NAMESPACE/MY_CUSTOM_THEME/web/js/ folder

require.config({
    deps: [
        'jquery'
    ],
    callback: function ($) {
        var form = $('form.subscribe');
 
        form.submit(function(e) {
            if(form.validation('isValid')){
                var email = $("#newsletter").val();
                var url = form.attr('action');
                var loadingMessage = $('#loading-message');
 
                if(loadingMessage.length == 0) {
                    form.find('.control').append('<div id="loading-message" style="display:none;padding-top:10px;">&nbsp;</div>');
                    var loadingMessage = $('#loading-message');
                }
 
                e.preventDefault();
                try{
                    loadingMessage.html('Submitting...').show();
                    $.ajax({
                        url: url,
                        dataType: 'json',
                        type: 'POST',
                        data: {email: email},
                        success: function (data){
                            if(data.status != "ERROR"){
                                $('#newsletter').val('');
                            }
                            loadingMessage.html(data.msg);
                        },
                        complete: function(){
                            setTimeout(function(){
                                loadingMessage.hide();
                            },5000);
                        }
                    });
                } catch (e){
                    loadingMessage.html(e.message);
                }
            }
            return false;
        });
    }
})

require.config({

deps: [

'jquery'

callback: function ($) {

var form = $('form.subscribe');

form.submit(function(e) {

if(form.validation('isValid')){

var email = $("#newsletter").val();

var url = form.attr('action');

var loadingMessage = $('#loading-message');

if(loadingMessage.length == 0) {

form.find('.control').append('<div id="loading-message" style="display:none;padding-top:10px;"> </div>');

var loadingMessage = $('#loading-message');

}

e.preventDefault();

try{

loadingMessage.html('Submitting...').show();

$.ajax({

url: url,

dataType: 'json',

type: 'POST',

data: {email: email},

success: function (data){

if(data.status != "ERROR"){

$('#newsletter').val('');

}

loadingMessage.html(data.msg);

complete: function(){

setTimeout(function(){

loadingMessage.hide();

},5000);

}

});

} catch (e){

loadingMessage.html(e.message);

}

return false;

});

}

})

Fill the below form if you have any Magento programming need.

Magento 2 : Get request params in your controller file
If you want get query string params in controller file,...
Magento 2 : Redirect custom page after login using plugin
Create di.xml and add the below code Magemonkey/Redirect/etc/frontend/di.xml [crayon-62846e342e2d9558341462/] Create...
Magento 2 – How to change local date to UTC date?
You can try below code to change local date to...
How to change order status using cron?
Step 1: First you need to add registration.php file in...
Magento 2: How to add close button on error and success message?
Step1 : Override message.js in current theme file on the...

Author Info

Magento Certified Developer

Hire J. Lakum

Fill the form & Get Installation Support

Magento2 Ajax Newsletter

Recent Articles

Author Info

Get a Free Quote

Connect With Us