6

here is my layout

    <referenceContainer name="minicart.addons">
  <block class="Vendor\Mymodule\Block\Cart\Sidebar" name="shipping_bar" template="Vendor_Mymodule::cart/minicart.phtml">
   <arguments>
     <argument name="jsLayout" xsi:type="array">
       <item name="components" xsi:type="array">
         <item name="minicart-addons" xsi:type="array">
           <item name="component" xsi:type="string">Vendor_Mymodule/js/view/minicartaddons</item>
           <item name="config" xsi:type="array"></item>
         </item>
       </item>
     </argument>
   </arguments>
 </block>

here is variable in phtml file

<script>
  maxpriceShipping = <?= /* @escapeNotVerified */ $maxpriceShipping ?>;
</script>

here is js file

define([
       'ko',
       'uiComponent',
       'Magento_Customer/js/customer-data',
   ], function (ko, Component, customerData) {
       'use strict';
       var subtotalAmount;
       var maxPrice = maxpriceShipping;
       var percentage;
       return Component.extend({
           displaySubtotal: ko.observable(true),
           maxprice:maxPrice.toFixed(2),
           /**
            * @override
            */
           initialize: function () {
               this._super();
               this.cart = customerData.get('cart');
           },
           getTotalCartItems: function () {
               return customerData.get('cart')().summary_count;
           },
           getpercentage: function () {
               subtotalAmount = customerData.get('cart')().subtotalAmount;
               if (subtotalAmount > maxPrice) {
                   subtotalAmount = maxPrice;
               }
               percentage = ((subtotalAmount * 100) / maxPrice);
               return percentage;
           }
       });
   });

How can I pass variable maxpriceShipping in phtml to js file without using a "script" tag. but can use "script type="text/x-magento-init""

4

In your .phtml please add following code.

<script type="text/x-magento-init">
{
    "*": {
        "Magepow_Ajaxcart/js/view/minicartaddons": {
            "maxpriceShipping": <?= /* @escapeNotVerified */ $maxpriceShipping ?>
        }
    }
}

And in your JS file please add below code to get maxpriceShipping

define([
       'ko',
       'uiComponent',
       'Magento_Customer/js/customer-data',
   ], function (ko, Component, customerData) {
       'use strict';
       var subtotalAmount;    
       var percentage;
       return Component.extend({
           displaySubtotal: ko.observable(true),
           maxprice:maxPrice.toFixed(2),
           /**
            * @override
            */
           initialize: function () {
               this._super();
               this.cart = customerData.get('cart');
               /* Add this code to get maxpriceShipping value*/
               /* You can use this variable to call this function in your JS*/
               this.maxPrice = ko.observable(this.maxpriceShipping);
               /* Code End*/
           },
           getTotalCartItems: function () {
               return customerData.get('cart')().summary_count;
           },
           getpercentage: function () {
               subtotalAmount = customerData.get('cart')().subtotalAmount;
               if (subtotalAmount > this.maxPrice) {
                   subtotalAmount = this.maxPrice;
               }
               percentage = ((subtotalAmount * 100) / this.maxPrice);
               return percentage;
           }
       });
   });

Please check and let me know in case of any issue.

  • I tried, but this error Failed to load the "Magepow_Ajaxcart/js/view/minicartaddons" component. – MichaelHa Sep 19 at 5:47
  • is the JS available in that location? can you please add this component with requirejs-config.js – Aasim Goriya Sep 19 at 8:26
  • Please update your answer. I don't know exactly to do it. – MichaelHa Sep 19 at 9:41
  • I have updated my code for .phtml file, so can you please try with this way ? – Aasim Goriya Sep 19 at 10:04
  • error: Cannot read property 'maxpriceShipping' of undefined ,I really want to give you an upvote, but my problem hasn't been solved yet. – MichaelHa Sep 19 at 10:14
0

you can add below code in ur phtml file

Hi you can use below code

<script type="text/x-magento-init">
        {
            "*": {
                "Magento_Ui/js/core/app": {
                    "components": {
                        "*": {
                            "component": "NameSpace_Module/js/product/view/jsfile",
                            "yourvariable": <?php echo $variableValue ?>

                        }
                     }
                }
            }
        }
    </script>

and you can access it in js as this.yourvariable

Please let me know if it helps you.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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