Return to Question

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""

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""

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

here is js filedefine([ '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; } }); });

<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;
           }
       });
   });

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 filedefine([ '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="x-magento-init""

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 filedefine([ '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""