0

I have been using a couple of guides to add a field to the shipping step in checkout: https://devdocs.magento.com/guides/v2.2/howdoi/checkout/checkout_new_field.html https://devdocs.magento.com/guides/v2.2/howdoi/checkout/checkout_custom_checkbox.html

I was able to successfully add my field by overriding the LayoutProcessor for a different extension, but when I try to just override Magento's LayoutProcessor, the field doesn't appear. So I think think it has something to do with how I'm creating the plugin, and not so much a problem with my code.

Below is the code I am trying to use to create the checkout field:

Namespace\Module\etc\frontend\di.xml

<?xml version="1.0"?>

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <type name="Magento\Checkout\Block\Checkout\LayoutProcessor">
    <plugin name="custom-checkout" type="Namespace\Module\Plugin\CheckoutLayoutPlugin" sortOrder="10"/>
</type>

</config>

Namespace\Module\Plugin\CheckoutLayoutPlugin.php

<?php
namespace Module\Namespace\Plugin;
class CheckoutLayoutPlugin
{
    public function afterProcess(\Magento\Checkout\Block\Checkout\LayoutProcessor $processor, $jsLayout){

    $test2 = 'tli_test2';

    $newField = [
        'component' => 'Magento_Ui/js/form/element/abstract',
        'config' => [
            'customScope' => 'shippingAddress.custom_attributes',
            'customEntry' => null,
            'template' => 'ui/form/field',
            'elementTmpl' => 'ui/form/element/input',
            'tooltip' => [
                'description' => 'description'
            ]
        ],
        'dataScope' => 'shippingAddress.custom_attributes.' . $test2,
        'label' => 'Custom Label',
        'provider' => 'checkoutProvider',
        'sortOrder' => 0,
        'validation' => [
            'required-entry' => true
        ],
        'options' => [],
        'filterBy' => null,
        'customEntry' => null,
        'visible' => true
    ];

    $jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']['shippingAddress']['children']['shipping-address-fieldset']['children'][$test2] = $newField;

    return $jsLayout;
    }
}

This alone should be enough to at least render the field, even if it doesn't do anything, but it still does not appear on the shipping step of checkout.

  • How to add css to the new field? – jibin george Oct 25 '19 at 12:19
0

Well, we've all had one of these days... Turns out it was a typo:

<type name="Magento\Checkout\Block\Checkout\LayoutProcessor">
               ^---| Should be "Magento"

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.