2

I have issues on removing the checkout postcode field on a default Magento 2.1 install.

I have tried by adding the componentDisabled node on the jsLayout object for the postcode component:

Created a new module with the following structure:

/
|etc
|___module.xml
|view
|___frontend
|______layout
|_________checkout_index_index.xml
|registration.php

The app/code/<VENDOR>/<MODULE>/view/frontend/layout/checkout_index_index.xml file contents:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="checkout.root" >
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="shipping-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="shippingAddress" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <item name="shipping-address-fieldset" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="postcode" xsi:type="array">
                                                                    <item name="config" xsi:type="array">
                                                                        <item name="componentDisabled" xsi:type="boolean">true</item>
                                                                    </item>
                                                                </item>
                                                                <item name="postcode_test" xsi:type="array">
                                                                    <item name="config" xsi:type="array">
                                                                        <item name="componentDisabled" xsi:type="boolean">true</item>
                                                                    </item>
                                                                </item>
                                                            </item> 
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

By inspecting the json returned by $block->getJsLayout() here, I find that the postcode node is overwritten by the one on the Magento_Checkout (this) module and the componentDisabled node from my module isn't used.

I am also noticing that my postcode_test note appears in this json.

Any help appreciated.

Improve this question

2 Answers 2

Reset to default
4

Heres an alternative way to do this. I use this same approach to remove the phone number field.

We need to make a plugin for the Magento\Quote\Model\Quote\Address class defined as follows:

class DummyZip
{
    public function afterGetPostcode()
    {
        return '00000';
    }
}

This eliminates the need to change all the validation. A dummy value is used that will bypass all that.

Now to hide the field, we extend the checkout_index_index.xml layout like this:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="checkout" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <css src="css/checkout.css"/>
    </head>
    <body>
        <referenceBlock name="checkout.root">
            <arguments>
                <argument name="jsLayout" xsi:type="array">
                    <item name="components" xsi:type="array">
                        <item name="checkout" xsi:type="array">
                            <item name="children" xsi:type="array">
                                <item name="steps" xsi:type="array">
                                    <item name="children" xsi:type="array">
                                        <item name="shipping-step" xsi:type="array">
                                            <item name="children" xsi:type="array">
                                                <item name="shippingAddress" xsi:type="array">
                                                    <item name="children" xsi:type="array">
                                                        <item name="shipping-address-fieldset" xsi:type="array">
                                                            <item name="children" xsi:type="array">
                                                                <item name="postcode" xsi:type="array">
                                                                    <item name="visible" xsi:type="boolean">false</item>
                                                                </item>
                                                            </item>
                                                        </item>
                                                    </item>
                                                </item>
                                            </item>
                                        </item>
                                    </item>
                                </item>
                            </item>
                        </item>
                    </item>
                </argument>
            </arguments>
        </referenceBlock>
    </body>
</page>

Finally, we'll also want to remove the field from the billing address form (if customer has different billing and shipping addresses). Create a plugin for the Magento\Checkout\Block\Checkout\LayoutProcessor class with this content:

class Process
{

    public function afterProcess($subject, $jsLayout)
    {
        foreach ($jsLayout['components']['checkout']['children']['steps']['children']['billing-step']['children']
                 ['payment']['children']['payments-list']['children'] as &$child)
        {
            unset($child['children']['form-fields']['children']['postcode']);
        }

        return $jsLayout;
    }
}
Improve this answer
5
  • This will just hide the field and use the dummy value instead removing all the validators, smart. Thanks!
    – Florin-Adrian Serbu
    Oct 1, 2016 at 11:15
  • how do you edit the Magento\Quote\Model\Quote\Address class?
    – Jon
    Mar 2, 2017 at 13:48
  • You make a plugin devdocs.magento.com/guides/v2.0/extension-dev-guide/…
    – Aaron Allen
    Mar 2, 2017 at 20:14
  • Hello, From billing address its not still removing
    – Stack user
    Aug 13, 2019 at 11:56
  • We are using the same way, but after upgrading to Magento 2.4.4, this is not working, have you checked this in Magento 2.4.4?
    – Chirag Prajapati
    Jul 29, 2022 at 6:27
1

I have figured out how to remove the postcode field. It cannot be done via jsLayout approach because it's dynamically created from EAV attributes on the LayoutProcessor class: https://github.com/magento/magento2/blob/develop/app/code/Magento/Checkout/Block/Checkout/LayoutProcessor.php#L68

So in order to accomplish this, we need to:

  1. Remove it from checkout form

Here we need to set is_user_defined to 1 for the postcode eav_attribute. I recommed doing this via a setup resource, like this:

public function install(ModuleDataSetupInterface $setup, ModuleContextInterface $context)
{
    /** @var \Magento\Customer\Setup\CustomerSetupFactory $customerSetup */
    $customerSetup = $this->customerSetupFactory->create(['setup' => $setup]);

    $setup->startSetup();

    $attribute = $customerSetup->getEavConfig()->getAttribute('customer_address', 'postcode');
    $attribute->setIsUserDefined(1)->save();

    $attribute->save();
}
  1. Disable the postcode validators

We have to disable 4 validators located under the following classes:

a) Magento\Customer\Api\AddressRepositoryInterface, _validate() method.

  • I did this by extending the save() and _validate() methods via inheritance.

b) Magento\Customer\Model\Address\Validator\Postcode, isValid() method.

c) Magento\Customer\Model\Attribute\Data\Postcode, validate() method.

d) Magento\Customer\Model\Address\AbstractAddress, validateValue() method.

  • I extended this last three methods via Plugin afterMethod.

After doing this you should be able to place an order without the postcode field.

I have also created a much detailed step by step tutorial here: http://serbu.me/2016/10/01/how-to-remove-postcode-field-from-magento2-checkout

Improve this answer
2
  • i had tried in magento 2.2.6 your step by step tutorial.. still pincode textfield not gone from checkout :(
    – Ask Xah
    Nov 28, 2018 at 10:44
  • HI @Florin I am facing the issue after removing the postcode
    – Manish Goswami
    Dec 3, 2019 at 12:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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