Hi I need to remove the cart page shipping rates list under the "Estimate Shipping and Tax" and move that block on the top of cart page. Can you give me some support to do that. SO far I have done the following changes
In checkout_cart_index.xml
<referenceContainer name="content">
<block class="Magento\Framework\View\Element\Template" name="checkout.cart.customblock" before="checkout.cart" template="Magento_Checkout::cart/deliveryOptions.phtml">
</block>
</referenceContainer>
In deliveryOptions.phtml
<div id="custom-component" data-bind="scope:'customcomponent'">
<!-- ko template: getTemplate() --><!-- /ko -->
<script type="text/x-magento-init">
{
"#custom-component": {
"Magento_Ui/js/core/app": {
"components": {
"customcomponent": {
"component": "Amasty_ShippingTableRates/js/view/cart/shipping-rates"
}
}
}
}
}
</script>
</div>
In shipping-rates.html which I included in js/view/cart/shipping-rates.js
<form id="co-shipping-method-form"
class="amrates-shipping-rates"
data-bind="blockLoader: isLoading, visible: isVisible()">
<p class="field note" data-bind="visible: (shippingRates().length <= 0)">
<!-- ko text: $t('Sorry, no quotes are available for this order at this time')--><!-- /ko -->
test
</p>
<fieldset class="fieldset rate" data-bind="visible: (shippingRates().length > 0)">
<dl class="items methods" data-bind="foreach: shippingRateGroups">
<dt class="item-title"><span data-bind="text: $data"></span></dt>
<dd class="item-options" data-bind="foreach: { data:$parent.getRatesForGroup($data), as: 'method' }">
<div data-bind="css: {'field choice item': available, 'message error': !available} ">
<!-- ko ifnot: (available) -->
<div data-bind="text: error_message"></div>
<!-- /ko -->
<!-- ko if: (available) -->
<input type="radio"
class="radio"
data-bind="
click: $parents[1].selectShippingMethod,
checked: $parents[1].selectedShippingMethod,
attr: {
value: carrier_code + '_' + method_code,
id: 's_method_' + carrier_code + '_' + method_code
}
"/>
<label class="label" data-bind="attr: {for: 's_method_' + carrier_code + '_' + method_code}">
<!-- ko text: $data.method_title --><!-- /ko -->
<each args="element.getRegion('price')" render=""></each>
<!-- ko ifnot: element.getRegion('price')-->
<!-- ko text: $parents[1].getFormattedPrice(amount) --><!-- /ko -->
<!-- /ko -->
</label>
<!-- /ko -->
</div>
<!-- ko if: $data.extension_attributes && $data.extension_attributes.amstartes_comment -->
<div>
<label class="label" data-bind="html: extension_attributes.amstartes_comment"></label>
</div>
<!-- /ko -->
<!-- ko if: (!$data.extension_attributes || !$data.extension_attributes.amstartes_comment) && $data.comment-->
<div>
<label class="label" data-bind="html: $data.comment"></label>
</div>
<!-- /ko -->
</dd>
</dl>
</fieldset>
</form>
Shipping rates have moved on the top of the page but it keep loading with following console error
Uncaught ReferenceError: Unable to process binding "foreach: function(){return { data:$parent.getRatesForGroup($data),as:'method'} }" Message: Unable to process binding "if: function(){return (available) }" Message: Unable to process binding "foreach: function(){return element.getRegion('price') }" Message: element is not defined at foreach (eval at createBindingsStringEvaluator
