On the shipping step in checkout I want to add a class to a form field if the validation of that field is successful but i'm not sure in what JS file I need to add this or where I should add a custom JS file. Can anyone point me in the right direction.

I'm trying to do something like this:

enter image description here

2 Answers 2


Default validation js file is validation.js located in lib/web/mage

Add custom js file Create checkout_index_index.xml under /app/design/frontend///Magento_Checkout/layout/ folder and add the follwing:

   <link src="<url of your js file>"/>

Also read this topic maybe it's helpful How to add custom js on checkout page Magento 2?


I ended up creating a new js file and adding it in the define in shipping.js.

In the js I check if the field's parents have an _error classes, if so the border turns red otherwise it gets a green border after the minimum length is reached.

Your Answer

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

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