How to load JAVASCRIPT In a PHTML template with requirejs VIA X-MAGENTO-INIT?

Magento 2 template supports require JS declaration using X-MAGENTO-INIT. You can define require js with the Magento PHTML template file.

Require js loaded as AMD (Asynchronous module definition) based approach.
Benefit:
Declare JS using text/x-magento-init will be loaded after the page DOM is loaded completely. It will improve the page load time. Continue reading “How to load JAVASCRIPT In a PHTML template with requirejs VIA X-MAGENTO-INIT?”

How statefull property used with knockout JS to keep form data without losing on reload Magento 2?

Magento 2 Keep form data without losing it on reloading the page, One of the useful Magento statefull properties from the UI module is used to save the state in the local storage of the browser.

A statefull object is used to set the state of the property.

You can see statefull: {} defined under the defaults object from the vendor/magento/module-ui/view/base/web/js/lib/core/element/element.js Continue reading “How statefull property used with knockout JS to keep form data without losing on reload Magento 2?”

How to customize ship to section in Order summary checkout Magento 2?

Magento 2 native supports a two-step checkout to place an order. Ship To section will be displayed in Order summary sidebar in Payment and Review Second Step.

Ship To section covers the Shipping address details chosen by the customer in the Shipping step and when you click on the edit icon in a ship to, It will redirect to the shipping step. Continue reading “How to customize ship to section in Order summary checkout Magento 2?”