Magento – Magento 1.9 : Add Block to One step checkout

blockscheckoutlayoutmagento-1.9

I have a extension that shows a price slider for store credit in the Cart.

I do not use the Cart and customers go straight to the Checkout.

I want to show the slider on my checkout instead. Here is the code:

<checkout_cart_index>
    <reference name="head">
        <action method="addItem"><type>skin_css</type><name>css/ei/creditpoint/creditpoint.slider.css</name><params/></action>
        <action method="addItem"><type>skin_js</type><name>js/ei/creditpoint/creditpoint.slider.js</name><params/></action>
    </reference>
    <reference name="checkout.cart">
        <block type="core/text_list" name="coupon.and.discount" as="coupon">
            <action method="insert">
                <block>checkout.cart.coupon</block>
            </action>
            <block type="creditpoint/creditpoint" name="creditpoints.cart.block" as ="creditpointblock" template="ei/creditpoint/checkout/cart/creditpoint_cart.phtml" before="checkout.cart.coupon"/>
        </block>
    </reference>
</checkout_cart_index>

My One Step Checkout XML file is using:

<onestepcheckout_index_index_flat_25columns>
    <reference name="head">
        <action method="addCss">
            <stylesheet>css/magestore/onestepcheckout/flat/onestepcheckout.css</stylesheet>
        </action>
        <block type="page/html_head" name="mobie_view" template="onestepcheckout/flat/head.phtml"/>
    </reference>
    <reference name="content">
        <block type="onestepcheckout/onestepcheckout" name="onestepcheckout" template="onestepcheckout/flat/3columns.phtml">
            <block type="onestepcheckout/onestepcheckout" name="onestepcheckout_billing" as="onestepcheckout.billing" template="onestepcheckout/flat/onestepcheckout/billing.phtml" />
            <block type="onestepcheckout/onestepcheckout" name="onestepcheckout_shipping" as="onestepcheckout.shipping" template="onestepcheckout/flat/onestepcheckout/shipping.phtml" />
            <block type="checkout/onepage_shipping_method_available" name="onestepcheckout_shipping_method" as="onestepcheckout.shipping_method" template="onestepcheckout/flat/onestepcheckout/shipping_method.phtml"/>
            <block type="checkout/onepage_payment_methods" name="onestepcheckout_payment_method" as="onestepcheckout.payment_method" template="onestepcheckout/flat/onestepcheckout/payment_method.phtml">
                <action method="setMethodFormTemplate">
                    <method>purchaseorder</method>
                    <template>payment/form/purchaseorder.phtml</template>
                </action>
            </block>
            <block type="checkout/onepage_review" name="onestepcheckout.onestepcheckout.review" as="onestepcheckout.review" template="onestepcheckout/flat/onestepcheckout/review.phtml">
                <block type="checkout/agreements" name="onestepcheckout.onestepcheckout.agreements" as="agreements" template="checkout/onepage/agreements.phtml"/>
                <block type="checkout/onepage_review_info" name="review_info" as="info" template="onestepcheckout/flat/onestepcheckout/review/info.phtml">
                    <action method="addItemRender">
                        <type>default</type>
                        <block>checkout/cart_item_renderer</block>
                        <template>onestepcheckout/flat/onestepcheckout/review/item.phtml</template>
                    </action>
                    <action method="addItemRender">
                        <type>grouped</type>
                        <block>checkout/cart_item_renderer_grouped</block>
                        <template>onestepcheckout/flat/onestepcheckout/review/item.phtml</template>
                    </action>
                    <action method="addItemRender">
                        <type>configurable</type>
                        <block>checkout/cart_item_renderer_configurable</block>
                        <template>onestepcheckout/flat/onestepcheckout/review/item.phtml</template>
                    </action>
                    <action method="addItemRender">
                        <type>bundle</type>
                        <block>bundle/checkout_cart_item_renderer</block>
                        <template>onestepcheckout/flat/onestepcheckout/review/item.phtml</template>
                    </action>
                    <block type="checkout/cart_totals" name="checkout.onepage.review.info.totals" as="totals" template="onestepcheckout/flat/onestepcheckout/review/totals.phtml"/>
                </block>
            </block>
        </block>
    </reference>
    <reference name="before_body_end">
        <block type="core/template" template="onestepcheckout/flat/login_popup.phtml" name="login-popup" />
    </reference>
</onestepcheckout_index_index_flat_25columns>

Best Answer

Try this:

<checkout_onepage_index>
    <reference name="head">
        <action method="addItem"><type>skin_css</type><name>css/ei/creditpoint/creditpoint.slider.css</name><params/></action>
        <action method="addItem"><type>skin_js</type><name>js/ei/creditpoint/creditpoint.slider.js</name><params/></action>
    </reference>
    <reference name="checkout.onepage">
        <block type="core/text_list" name="coupon.and.discount" as="coupon">
            <action method="insert">
                <block>checkout.cart.coupon</block>
            </action>
            <block type="creditpoint/creditpoint" name="creditpoints.cart.block" as ="creditpointblock" template="ei/creditpoint/checkout/cart/creditpoint_cart.phtml" before="checkout.cart.coupon"/>
        </block>
    </reference>
</checkout_onepage_index>

This should add your block in checkout page. However, you will have to find the standard place for your block.

You may want to check <checkout_onepage_index translate="label"> node in "layout/checkout.xml" file.

Related Solutions

Magento 2 Checkout – Add Cross Sell Block to Checkout Step

If you want to call a block in html file, AJAX loading the content is the way to it. Magento 2's export functionality does the same thing. When you change export entity magento has to change filter html that is rendered. so magento calls this Controller

Magento\ImportExport\Controller\Adminhtml\Export\GetFilter

Observe the code in execute method. There are two key things

 $resultLayout = $this->resultFactory->create(ResultFactory::TYPE_LAYOUT);
return $resultLayout;

So you are going to return a layout and NOT a page layout.

Name of your xml will be .xml That means you will create a xml like this

<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/layout_generic.xsd">
<container name="root" label="Root">
           <block class="Magento\Checkout\Block\Cart\Crosssell" name="checkout.cart.crosssell" template="Magento_Catalog::product/list/items.phtml" after="-">
                <arguments>
                    <argument name="type" xsi:type="string">crosssell</argument>
                </arguments>
                <block class="Magento\Catalog\Block\Product\ProductList\Item\Container" name="crosssell.product.addto" as="addto">
                    <block class="Magento\Catalog\Block\Product\ProductList\Item\AddTo\Compare"
                           name="crosssell.product.addto.compare" as="compare"
                           template="Magento_Catalog::product/list/addto/compare.phtml"/>
                </block>
            </block>
</container>

Notice that parent node is and not That's it. You will have your cross sell html as response to your ajax request. Just insert the html wherever you want.

To an ajax call you can write jquery inside your html. somthing like this

<script>
require(['jquery'],function($){
   $.get('url/of/controller',function(response){
      //do stuff with your html
   })
})
<script>

If you knockout do with knockout. Or doing it with x-magento-init is even better.

Just start with a simple echo "Hello world" in your controller and it will become clear. If your controller action is route/controller/action then your layout name should be route_controller_action.xml . That's why result factory knows which layout.xml to use from your module

Magento – Add JS to head in Cart

Go to app/design/frontend/{package}/{theme}/layout/local.xml then add this :

<checkout_cart_index>
    <reference name="head">
        <action method="addItem"><type>skin_js</type><name>js/my-custom.js</name></action>
    </reference>
</checkout_cart_index>

Create your new js file in: skin/frontend/{package}/{theme}/js/my-custom.js then put your code inside.
Now your js file will be just loaded in checkout/cart. Don't forget to clear the cache.

NB: I see some errors in your code:

<frontend> // not </frontend>
    <layout>
        <updates>
            <module_name>
                <file>module_name.xml</file>
            </module_name>
        </updates>
    </layout>
</frontend>

You can't load this type of block in a head ! but you can do it content, root etc...

If you need is to add a js file, follow my solution.

Best Answer

Related Solutions

Magento 2 Checkout – Add Cross Sell Block to Checkout Step

Magento – Add JS to head in Cart

Related Topic