Alert in Javascript

Question

On my order site, I have 2 options: pick up and delivery.

When choosing pick up, nothing happens, but when choosing delivery, the delivery address will appear for the user to fill in.

I want to use JS to notify you that you need to enter your shipping address only I you tick the delivery box.

Thank you.

/*Notify when information is invalid.*/
function validate() {
  var pickup = document.getElementById("pickup").checked;
  var delivery = document.getElementById("delivery").checked;
  var deladd = document.getElementById("delivery_address").value;
  var biladd = document.getElementById("billing_address").value;

  if ((pickup == "") && (delivery == "")) {
    errMsg += "Select an option. \\n";
  }
  if ((deladd == false) && (deladd == "")) {
    errMsg += "Delivery address can not be empty.\\n";

    if (errMsg != "") {
      alert(errMsg);
      result = false;
    }

    return result;
  }

  function init() {
    var regForm = document.getElementById("form");
    regForm.onsubmit = validate;
  }
  window.onload = init;

<div class="box">Select an option:
  <input type="radio" id="pickup" name="option" value="pickup" class="radio" onclick="hideAddress()">
  <label for="pickup" class="check">Pick Up</label>
  <input type="radio" id="delivery" name="option" value="delivery" class="radio" onclick="showAddress()">
  <label for="delivery" class="check">Delivery</label>
</div><br>

<div class="show" id="show">

  <!--Delivery address.-->
  <input type="text" placeholder="delivery address:" class="box" id="delivery_address" name="delivery_address">

  <!--Check the same as the delivery address or not.-->
  <label for="checkbox"> billing address same as delivery address</label>
  <input type="checkbox" id="same_address" name="same_adsress_or_not" value="same_adress" onclick="autoFill()">
</div>

`window.onload = init;` <-- Don't do this. Use `addEventListener` instead. — Dai, Nov 19 '22 at 04:30
Note that there are [much better alternatives](/q/14028959/4642212) to a `load` listener, like `type="module"`, `defer`, or `DOMContentLoaded`. — Sebastian Simon, Nov 19 '22 at 04:46

Ski3r3n · Answer 1 · 2022-11-19T07:06:01.953

/*Notify when information is invalid.*/
function validate() {
  var pickup = document.getElementById("pickup").checked;
  var delivery = document.getElementById("delivery").checked;
  var deladd = document.getElementById("delivery_address").value;
  var biladd = document.getElementById("billing_address").value;

  if ((pickup == "") && (delivery == "")) {
    errMsg += "Select an option. \\n";
  }
  if ((deladd == false) && (deladd == "")) {
    errMsg += "Delivery address can not be empty.\\n";

    if (errMsg != "") {
      alert(errMsg);
      result = false;
    }

    return result;
  }
}//closed here
  function init() {
    var regForm = document.getElementById("form");
    regForm.onsubmit = validate;
  }
  window.onload = init;

<div class="box">Select an option:
  <input type="radio" id="pickup" name="option" value="pickup" class="radio" onclick="hideAddress()">
  <label for="pickup" class="check">Pick Up</label>
  <input type="radio" id="delivery" name="option" value="delivery" class="radio" onclick="showAddress()">
  <label for="delivery" class="check">Delivery</label>
</div><br>

<div class="show" id="show">

  <!--Delivery address.-->
  <input type="text" placeholder="delivery address:" class="box" id="delivery_address" name="delivery_address">

  <!--Check same as delivery address or not.-->
  <label for="checkbox"> billing address same as delivery address</label>
  <input type="checkbox" id="same_address" name="same_adsress_or_not" value="same_adress" onclick="autoFill()">
</div>

In your code, you appear to have forgotten to close the function validate()'s curly brackets (never closed the bracket "{").

Always remember to close your brackets. Hope this helps :).

(still shows errors because incomplete code)

Alert in Javascript

1 Answers1