HOW TO Hide Zip, City, District Input Fields On Selecting “Cash On Delivery” & Show These Fields On Selecting “Online Payment”

Just follow the below steps

1. First You Have to login into your Manage Panel.
2. Please go to Design -> Custom JS

3. Give a Name and select the position where you will write the JS (Java Script)
4. Just Copy and paste the following Code in the editor and Save.

var a = document.querySelector("#checkout > div:nth-child(4) > div:nth-child(3) > div > label > input");
var b = document.querySelector("#checkout > div:nth-child(4) > div:nth-child(4) > div > label > input");

a.checked = true;
document.querySelector("#checkout > div:nth-child(3) > div.col-5.col-md-5.col-lg-3.mb-3").style.display="none";
 document.querySelector("#checkout > div:nth-child(3) > div:nth-child(6)").style.display="none";
  document.querySelector("#checkout > div:nth-child(3) > div:nth-child(7)").style.display="none";
  document.getElementById('zip-code').removeAttribute("required");
  document.getElementById('city').removeAttribute("required");
  document.getElementById('district').removeAttribute("required");

var rad = document.getElementsByName('paymentMethod');
var prev = 'cod';
for (var i = 0; i < rad.length; i++) {
    rad[i].addEventListener('change', function() {
        (prev) ? console.log(prev.value): null;
        if (prev.value != 'sslcommerz-payment-gateway') {
            prev = this;
            document.querySelector("#checkout > div:nth-child(3) > div.col-5.col-md-5.col-lg-3.mb-3").style.display="block"; 
            document.querySelector("#checkout > div:nth-child(3) > div:nth-child(6)").style.display="block"; 
            document.querySelector("#checkout > div:nth-child(3) > div:nth-child(7)").style.display="block";
            document.getElementById('zip-code').attributes.required = true;
            document.getElementById('city').attributes.required = true;
            document.getElementById('district').attributes.required = true;
        }
        else{
            prev = this;
            document.querySelector("#checkout > div:nth-child(3) > div.col-5.col-md-5.col-lg-3.mb-3").style.display="none";
            document.querySelector("#checkout > div:nth-child(3) > div:nth-child(6)").style.display="none";
            document.querySelector("#checkout > div:nth-child(3) > div:nth-child(7)").style.display="none";
        }
        console.log(this.value)
    });
}