How to Make Purchase Order Number Field Optional in Magento 2?

Hello Magento Friends,

Magento 2 defaults require a Purchase Order (PO) Number when a customer selects Payment Method: Purchase Order during checkout. This works well for B2B businesses that use PO Numbers for their internal procurement tracking.

However, in many instances, store owners may want to make this field optional to simplify the checkout process.

In this blog, we are going to show you how to make the Purchase Order Number field optional in Magento 2.

Steps to Make Purchase Order Number Field Optional in Magento 2:

Step 1: Create the requirejs-config.js file at the file path given below.

{{magento_root}}\app\code\Vendor\Extension\view\frontend\requirejs-config.js

Now, add the code as follows

var config = {
    map: {
        '*': {
            'Magento_OfflinePayments/template/payment/purchaseorder-form.html': 
            'Vendor_Extension/template/payment/purchaseorder-form.html'
        }
    }
};

Step 2: Create the purchaseorder-form.html file at the following path.

{{magento_root}}\app\code\Vendor\Extension\view\frontend\web\template\payment\purchaseorder-form.html

Now add the following piece of code

<div class="payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
    <div class="payment-method-title field choice">
        <input type="radio"
               name="payment[method]"
               class="radio"
               data-bind="attr: {'id': getCode()}, value: getCode(), checked: isChecked, click: selectPaymentMethod, visible: isRadioButtonVisible()"/>
        <label data-bind="attr: {'for': getCode()}" class="label">
            <span data-bind="text: getTitle()"></span>
        </label>
    </div>

    <div class="payment-method-content">
        <!-- ko foreach: getRegion('messages') -->
        <!-- ko template: getTemplate() --><!-- /ko -->
        <!--/ko-->
        <div class="payment-method-billing-address">
            <!-- ko foreach: $parent.getRegion(getBillingAddressFormName()) -->
            <!-- ko template: getTemplate() --><!-- /ko -->
            <!--/ko-->
        </div>
        <form id="purchaseorder-form" class="form form-purchase-order" data-role="purchaseorder-form">
            <fieldset class="fieldset payment method" data-bind='attr: {id: "payment_form_" + getCode()}'>
                <div class="field field-number">
    <label for="po_number" class="label">
        <span><!-- ko i18n: 'Purchase Order Number'--><!-- /ko --></span>
    </label>
    <div class="control">
        <input type="text"
               id="po_number"
               name="payment[po_number]"
               data-bind='
                                attr: {title: $t("Purchase Order Number")},
                                value: purchaseOrderNumber'
               class="input-text"/>
    </div>
</div>
            </fieldset>

            <div class="checkout-agreements-block">
                <!-- ko foreach: $parent.getRegion('before-place-order') -->
                    <!-- ko template: getTemplate() --><!-- /ko -->
                <!--/ko-->
            </div>

            <div class="actions-toolbar" id="review-buttons-container">
                <div class="primary">
                    <button class="action primary checkout"
                            type="submit"
                            data-bind="
                            click: placeOrder,
                            attr: {title: $t('Place Order')},
                            enable: (getCode() == isChecked()),
                            css: {disabled: !isPlaceOrderActionAllowed()}
                            "
                            data-role="review-save">
                        <span data-bind="i18n: 'Place Order'"></span>
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

Step 3: Create the di.xml file at the below-mentioned path.

{{magento_root}}\app\code\Vendor\Extension\etc\di.xml

Then add the following code

<?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\OfflinePayments\Model\Purchaseorder">
        <plugin name="purchase_order_validate" type="Vendor\Extension\Plugin\Model\Purchaseorder"/>
    </type>
</config>

Step 4: Create Purchaseorder.php file at the following path

{{magento_root}}\app\code\Vendor\Extension\Plugin\Model\Purchaseorder.php

After that, include the below-mentioned code

<?php
namespace Vendor\Extension\Plugin\Model;
class Purchaseorder
{
    public function aroundvalidate($subject, $proceed)
    {
        if (empty($subject->getInfoInstance()->getPoNumber())) {
            return $this;
        }
        return $this;
    }
}

Output:

Go to your store, choose Purchase Order during checkout, and you should now be able to place the order without entering a PO number.

Conclusion:

Customizing Magento 2 to fit your business workflow is a powerful feature. By making the Purchase Order Number field optional, you give your customers more flexibility during checkout, especially useful when you don’t need strict procurement tracking.

However, if you’re running a B2B store where PO numbers are required for audits or invoicing, it’s best to leave this field mandatory.

Happy Coding!