you need to create a plugin in your custom module ( the one that you used to create the custom attribute ), and have the code something like the following one:
namespace Package\Name\Plugin\Checkout;
class LayoutProcessor
{
public function afterProcess(
\Magento\Checkout\Block\Checkout\LayoutProcessor $subject,
array $jsLayout
) {
// Loop all payment methods (because billing address is appended to the payments)
$configuration = $jsLayout['components']['checkout']['children']['steps']['children']['billing-step']['children']['payment']['children']['payments-list']['children'];
foreach ($configuration as $paymentGroup => $groupConfig) {
if (isset($groupConfig['component']) AND $groupConfig['component'] === 'Magento_Checkout/js/view/billing-address') {
$jsLayout['components']['checkout']['children']['steps']['children']['billing-step']['children']
['payment']['children']['payments-list']['children'][$paymentGroup]['children']['form-fields']['children']['custom_attribute_code'] = [
'component' => 'Magento_Ui/js/form/element/abstract',
'config' => [
'template' => 'ui/form/field',
'elementTmpl' => 'ui/form/element/input',
'id' => 'custom_attribute_id',
],
'dataScope' => $groupConfig['dataScopePrefix'] . '.custom_attribute_id',
'label' => __('Custom attribute label'),
'provider' => 'checkoutProvider',
'visible' => true,
'validation' => [
'required-entry' => true,
'min_text_length' => 0,
],
'sortOrder' => 300,
'id' => 'custom_attribute_id'
];
}
}
return $jsLayout;
}
}
Hope this helps
Finally I Got Solution by creating new Module :)
Referce Post: Magento 2 - How to affect street address in checkout forms with layout xml/ui arguments
magento\app\code\Custom\Checkout\registration.php
\Magento\Framework\Component\ComponentRegistrar::register(
\Magento\Framework\Component\ComponentRegistrar::MODULE, 'Custom_Checkout', __DIR__
);
magento\app\code\Custom\Checkout\etc\module.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="Custom_Checkout" setup_version="1.0.0" />
</config>
magento\app\code\Custom\Checkout\etc\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="Custom\Checkout\Block\LayoutProcessor" sortOrder="100"/>
</type>
</config>
magento\app\code\Custom\Checkout\Block\LayoutProcessor.php
namespace Custom\Checkout\Block;
class LayoutProcessor {
/**
* @param \Magento\Checkout\Block\Checkout\LayoutProcessor $subject
* @param array $jsLayout
* @return array
*/
public function afterProcess(
\Magento\Checkout\Block\Checkout\LayoutProcessor $subject, array $jsLayout
) {
$jsLayout['components']['checkout']['children']['steps']['children']['shipping-step']['children']
['shippingAddress']['children']['shipping-address-fieldset']['children']['street'] = [
'component' => 'Magento_Ui/js/form/components/group',
'label' => __('Street Address'),
'required' => true,
'dataScope' => 'shippingAddress.street',
'provider' => 'checkoutProvider',
'sortOrder' => 60,
'type' => 'group',
'children' => [
[
'component' => 'Magento_Ui/js/form/element/abstract',
'config' => [
'customScope' => 'shippingAddress',
'template' => 'ui/form/field',
'elementTmpl' => 'ui/form/element/input'
],
'dataScope' => '0',
'provider' => 'checkoutProvider',
'validation' => ['required-entry' => true, "min_text_length" => 1, "max_text_length" => 50],
],
[
'component' => 'Magento_Ui/js/form/element/abstract',
'config' => [
'customScope' => 'shippingAddress',
'template' => 'ui/form/field',
'elementTmpl' => 'ui/form/element/input'
],
'dataScope' => '1',
'provider' => 'checkoutProvider',
'validation' => ['required-entry' => false, "min_text_length" => 1, "max_text_length" => 50],
]
]
];
return $jsLayout;
}
}
Thanks :)
Best Answer
You can achieve this goal by using Plugins. First You should add the plugin file to
MY_MODULE/etc/frontend/di.xml
then Create
LayoutProcessor.php
underMY_MODULE/Plugin/Checkout/Block/Checkout/
and edit it like this