Magento – Magento 2 – Add success message with knockout

knockoutjsmagento-2.1magento2messages

I need add an errorMessage or successMessage on checkout/cart after an jquery validation. I tried require file 'Magento_Ui/js/model/messageList' for this but not have success.

My code:

define(
    [
        'jquery',
        'Magento_Ui/js/model/messageList'
    ],
    function ($, messageList) {
       $.ajax({
           type: "GET",
           url: /route/controller,
           async: false,
           success: function (res) {
               if (res.val) {
                  messageList.addErrorMessage({'message': messageError});
               }
           }
       });
    }
);

Best Answer

I'm not sure if you already solved this or not, but here it goes anyway. While Rakesh might be right (a controller is the preferred way), it doesn't answer the question. I found the easiest way of doing this is through the customerData object:

customerData.set('messages', {
    messages: [{
        type: 'success',
        text: 'Hello World'
    }]
});

Related Solutions

Magento 2.1 – Use urlBuilder->getUrl() in Custom Module Controller

If your controller extend Magento\Framework\App\Action\Action you should follow rules of creation of the controller. So you should implement dependency injection of the parent class constructor (Magento\Framework\App\Action\Action):

/**
 * @param Context $context
 */
public function __construct(Context $context)
{
    parent::__construct($context);
    $this->_objectManager = $context->getObjectManager();
    $this->_eventManager = $context->getEventManager();
    $this->_url = $context->getUrl();
    $this->_actionFlag = $context->getActionFlag();
    $this->_redirect = $context->getRedirect();
    $this->_view = $context->getView();
    $this->messageManager = $context->getMessageManager();
}

Your construct method should look like this after a modifications:

/**
 * @param Context $context
 * @param UrlInterface $urlBuilder
 */
public function __construct(
    Context $context,
    UrlInterface $urlBuilder
) {
    parent::__construct($context);
    $this->urlBuilder = $urlBuilder;
}

NOTE: do not forget to remove old var/generation directory after implementing of modifications, because there are stored the generated files of controllers.

Magento – Magento 2 – Update quantity and totals of cart page without page reload

Have you tried deferred operation with getTotalsAction or totals-processor?

It's showing ajax process in your cart after calcul

you can use it like this (i minimize your code, just to show you how to use these functions.) :

require(["jquery", "Magento_Customer/js/customer-data","jquery/jquery-storageapi","Magento_Checkout/js/model/cart/totals-processor/default","Magento_Checkout/js/model/cart/cache","Magento_Checkout/js/model/quote","Magento_Checkout/js/action/get-totals"], function ($,defaultTotal,cartCache,quote,getTotalsAction) {
$(document).on("submit","form#form-validate", function (e) {
    e.preventDefault();
    $.ajax({
        url: form.attr("action"),
        data: form.serialize(),
        type: "post",
        success: function (res) {

    var deferred = $.Deferred();
    // this show ajax loader and reload price in cart
    getTotalsAction([], deferred);
    // this one too 
    defaultTotal.estimateTotals();
        },
        error: function () {
            console.log("error");
        }
    });
    console.log("form submitted");
});});

I suggest you to show this post for updating price in cart : How to add fee to order totals in Magento 2 and this one : https://github.com/sivajik34/Custom-Fee-Magento2

Best Answer

Related Solutions

Magento 2.1 – Use urlBuilder->getUrl() in Custom Module Controller

Magento – Magento 2 – Update quantity and totals of cart page without page reload

Related Topic