Magento 2 Checkout Page billing address dropdown remove show direct billing address form

Question

Magento 2 I want to Checkout Page billing address dropdown remove show direct billing address form.

This dropdown i want to remove

And show direct billing address form.This type

THANKS.

Answer 1

Try with below code to remove address-list dropdown and show billing-address form direct.

Create requirejs-config.js file on below path to add mixin for billing-address.js in your custom module.

app/code/Vendor/Module/view/frontend/requirejs-config.js

var config = {
config: {
    mixins: {
        'Magento_Checkout/js/view/billing-address': {
            'Vendor_Module/js/view/billing-address-mixin': true
        }
    }
}

};

Add mixin file billing-address-mixin.js on below path

app/code/Vendor/Module/view/frontend/web/js/view/billing-address-mixin.js

define([
  'jquery',
  'Magento_Customer/js/model/address-list',
  'Magento_Checkout/js/model/quote',
  'Magento_Checkout/js/action/select-billing-address',
  'Magento_Checkout/js/checkout-data',
  'Magento_Customer/js/customer-data'
],
function (
  $,
  addressList,
  quote,
  selectBillingAddress,
  checkoutData,
  customerData
) {
  'use strict';
  var lastSelectedBillingAddress = null,
    countryData = customerData.get('directory-data'),
    addressOptions = addressList().filter(function (address) {
      return address.getType() === 'customer-address';
    });

  return function (Component) {
    return Component.extend({

      /**
       * @return {Boolean}
       */
      useShippingAddress: function () {
        if (this.isAddressSameAsShipping()) {
          selectBillingAddress(quote.shippingAddress());

          this.updateAddresses();
          this.isAddressDetailsVisible(true);
        } else {
          lastSelectedBillingAddress = quote.billingAddress();
          quote.billingAddress(null);
          this.isAddressDetailsVisible(false);
          $('.field.field-select-billing').hide();
          this.isAddressFormVisible(true);
        }
        checkoutData.setSelectedBillingAddress(null);

        return true;
      }
    });
  };
});

I hope this will help you. Thanks!