TypeError when trying to count checkboxes

I’m painfully close here – I’m getting a TypeError when the form is submitted and no checkboxes are selected in the HTML file – the error occurs when pizzaOptions.length is being read (line 37 of the js file) because I’m assuming it’s trying to read something that’s undefined?

How do I work around this. Here is my TypeError: enter image description here

var express = require('express');
var bodyParse = require('body-parser');
var app = express();

app.use(express.static('public_html'));
app.use(bodyParse.urlencoded({
  extended: false
}));


function addMinutes(date, minutes) {
  return new Date(date.getTime() + minutes * 60000);
}

app.post('/order', function(req, res) {
  var days, months;
  days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
  months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
  let firstname = req.body.firstname;
  let surname = req.body.surname;
  let timeNow = new Date();
  let address = req.body.address;
  let city = req.body.city;
  let postCode = req.body.postcode;
  let state = req.body.state;
  let email = req.body.email;
  let phoneNumber = req.body.mobile;
  let pizzaType = req.body.pizzaType;
  let numberOfPizzas = req.body.numBoxes;
  let pizzaSize = req.body.pizzaSize;
  let pizzaOptions = req.body.pizzaOptions;
  let orderDate = new Date();
  let promoCode = req.body.promoCode;
  let deliveryTime = addMinutes(orderDate, 45).toLocaleTimeString();

  if (typeof pizzaOptions === "undefined") {
    pizzaOptions
  }
  let totalPizzaOptions = 0.5 * pizzaOptions.length;

  if (totalPizzaOptions > 2) {
    totalPizzaOptions = 0.5;
  }

  // PIZZA COSTS
  let cheese = 12.55;
  let veggie = 12.75;
  let marinara = 15.55;
  let supreme = 16.25;
  let tropical = 11.75;
  let veggiesupreme = 13.75;
  //SIZE COSTS
  let Medium = 1.50;
  let Large = 2;
  let XLarge = 3.50;

  //TOTALS AND DELIVERY
  let totalCost = 0;
  let finalAmount = 0;
  let discount = 0;
  let discountAmount = 0;
  let deliveryCost = 5;

  switch (pizzaType) {
    case 'Cheese Pizza':
      totalCost = totalCost + cheese;
      break;
    case 'Veggie Pizza':
      totalCost = totalCost + veggie;
      break;
    case 'Marinara Pizza':
      totalCost = totalCost + marinara;
      break;
    case 'Super Supreme':
      totalCost = totalCost + supreme;
      break;
    case 'Tropical Pizza':
      totalCost = totalCost + tropical;
      break;
    case 'Veggie Supreme':
      totalCost = totalCost + veggiesupreme;
  }

  switch (pizzaSize) {
    case 'Small':
      totalCost = totalCost + 0;
      break;
    case 'Medium':
      totalCost = totalCost + Medium;
      break;
    case 'Large':
      totalCost = totalCost + Large;
      break;
    case 'Extra Large':
      totalCost = totalCost + XLarge;
  }

  switch (promoCode) {
    case "7342418":
      discount = "Dinner-4-All (10%)";
      discountAmount = 0.1;
      break;
    case "8403979":
      discount = "Winter-Special (25%)";
      discountAmount = 0.25;
      break;
    case "2504647":
      discount = "Midweek-Deal (50%)";
      discountAmount = 0.5;
      break;
    case "8406800":
      discount = "Special Gift (75%)";
      discountAmount = 0.75;
      break;
    default:
      discount = "No discount applied";
      discountAmount = 0;
  }


  totalCost = totalCost * numberOfPizzas;
  discountAmount = (totalCost * discountAmount);
  finalAmount = (totalCost - discountAmount) + deliveryCost + totalPizzaOptions;
  finalAmount = finalAmount.toFixed(2);


  res.write('<html><head>');
  res.write("<link rel='stylesheet' href='https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css' integrity='sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk' crossorigin='anonymous'></head>");
  res.write('<body> <div class="container">');
  res.write("<h1 class='text-left'>ORDER CONFIRMATION</h1>");
  res.write(`<p>Thank you for your order received on: <strong>${timeNow}</strong></p>`);

  res.write("<h2 class='text-left'>Pizza Details</h2>");
  res.write(`<p>${numberOfPizzas} x ${pizzaSize} ${pizzaType} [Options: ${pizzaOptions}]</p>`);


  res.write("<h2 class='text-left'>Customer Details</h2>");
  res.write(`<p>Customer: ${firstname} ${surname}</p>`);
  res.write(`<p>Address: ${address}, ${city}, ${state}, ${postCode}</p>`);
  res.write(`<p>Contact mobile: ${phoneNumber}</p>`);
  res.write(`<p>Contact email: ${email}</p>`);


  res.write("<h2 class='text-left'>Pizza Cost</h2>");

  res.write('<div class="container">');
  res.write('<div class="row">');
  res.write('<div class="col">');
  res.write(`<p>${numberOfPizzas} x ${pizzaSize} ${pizzaType} [Options: ${pizzaOptions}]</p>`);
  res.write('</div>');
  res.write('<div class="col">');
  res.write(`$ ${totalCost}`);
  res.write('</div>');
  res.write('</div>');

  res.write('<div class="row">');
  res.write('<div class="col">');
  res.write(`Optional Extras @ $0.50 each`);
  res.write('</div>');
  res.write('<div class="col">');
  res.write(`$ ${totalPizzaOptions}`);
  res.write('</div>');
  res.write('</div>');

  res.write('<div class="row">');
  res.write('<div class="col">');
  res.write('Delivery');
  res.write('</div>');
  res.write('<div class="col">');
  res.write(`$ ${deliveryCost}.00`);
  res.write('</div>');
  res.write('</div>');

  res.write('<div class="row">');
  res.write('<div class="col">');
  res.write(`Discount - ${discount}`);
  res.write('</div>');
  res.write('<div class="col">');
  res.write(`$ - ${discountAmount}`);
  res.write('</div>');
  res.write('</div>');

  res.write('<div class="row">');
  res.write('<div class="col">');
  res.write('<strong>Total');
  res.write('</div>');
  res.write('<div class="col">');
  res.write(`$ ${finalAmount}</strong>`);
  res.write('</div>');
  res.write('</div>');
  res.write('</div>');

  res.write("<h2 class='text-left'>Estimated Delivery Time</h2>");
  res.write(`<p>Delivery Expected by: <strong>${deliveryTime}</strong> -- or the pizza is free!</p>`);

  src = "https://code.jquery.com/jquery-3.5.1.slim.min.js"
  integrity = "sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
  crossorigin = "anonymous"
  src = "https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"
  integrity = "sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
  crossorigin = "anonymous"
  src = "https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
  integrity = "sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
  crossorigin = "anonymous"
  res.write('</body></html>');
  res.send();
});

app.listen(3000, function() {
  console.log("Web server running at: http://localhost:3000");
  console.log("Type Ctrl+C to shut down the web server");
});
<!doctype html>
<html lang="en">

<head>
  <title>Task 9.3C</title>

  <meta charset="utf-8">
  <meta name="author" content="SIT774">
  <meta name="description" content="Express Sqlite3 Demo">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

  <!-- Latest compiled and minified CSS -->
  <!-- CSS only -->
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
</head>
<script>
  function myFunction() {
    var pizzaOptions = document.forms[0];
    var txt = 0;
    var i;
    for (i = 0; i < pizzaOptions.length; i++) {
      if (pizzaOptions[i].checked) {
        txt = txt + pizzaOptions[i].value + " ";
      }
    }
  }
</script>

<body>
  <div class="container">

    <h1>dKin Pizza Order Form</h1>
    <p>Thank you for choosing dKin Pizza! Please fill in the customer &amp; pizza order details below.</p>

    <form action="/order" method="post" name="form" id="form">
      <h5 class="bg-primary text-white rounded-sm p-1">Customer Details</h5>
      <div class="form-row">
        <div class="col-sm-6 mb-1">
          <label for="firstname"><small>First name</small></label>
          <input type="text" class="form-control" name="firstname" id="firstname" placeholder="Mark" required>
        </div>
        <div class="col-sm-6 mb-1">
          <label for="surname"><small>Last name</small></label>
          <input type="text" class="form-control" name="surname" id="surname" placeholder="Smith" required>
        </div>
      </div>
      <div class="form-row">
        <div class="col mb-1">
          <label for="address"><small>Delivery
                            Address</small></label>
          <input type="text" class="form-control" name="address" id="address" placeholder="123 Apple St" required>
        </div>
      </div>

      <div class="form-row">
        <div class="col-sm-6 mb-1">
          <label for="city"><small>City</small></label>
          <input type="text" class="form-control" name="city" id="city" placeholder="Geelong" required>
        </div>
        <div class="col-sm-3 mb-1">
          <label for="state"><small>State</small></label>
          <select class="custom-select " name="state" id="state" required>
            <option selected disabled value="">Choose...</option>
            <option>VIC</option>
            <option>NSW</option>
            <option>ACT</option>
            <option>QLD</option>
            <option>SA</option>
            <option>TAS</option>
            <option>SA</option>
          </select>
        </div>
        <div class="col-sm-3 mb-1">
          <label for="postcode"><small>Postcode</small></label>
          <input type="text" class="form-control" name="postcode" id="postcode" placeholder="3216" required>
        </div>
      </div>
      <div class="form-row">
        <div class="col-sm-6 mb-4">
          <label for="email"><small>Email
                            address</small></label>
          <input type="text" class="form-control" name="email" id="email" placeholder="[email protected]" required>
        </div>
        <div class="col-sm-6 mb-4">
          <label for="mobile"><small>Mobile number
                        </small></label>
          <input type="text" class="form-control" name="mobile" id="mobile" placeholder="04xx xxxx" required>
        </div>
      </div>

      <h5 class="bg-primary text-white rounded-sm p-1 mb-3">Pizza Selection
      </h5>

      <div class="form-group row">
        <label class="col-sm-2 col-form-label text-sm-right" for="pizzaType">Select
                    your pizza:</label>
        <div class="col-sm-6 my-auto">
          <select class="form-control" name="pizzaType" id="pizzaType" required>
            <option selected disabled value="">Please select a pizza type....
            </option>
            <option value="Cheese Pizza">Cheese Pizza</option>
            <option value="Veggie Pizza">Veggie Pizza</option>
            <option value="Marinara Pizza">Marinara Pizza</option>
            <option value="Super Supreme">Super Supreme</option>
            <option value="Tropical Pizza">Tropical Pizza</option>
            <option value="Veggie Supreme">Veggie Supreme</option>
          </select>
        </div>
        <label class="col-form-label col-sm-2 text-sm-right" for="numberOfPizzas">Number of pizzas:</label>
        <div class="col-sm-2 my-auto">
          <input type="number" class="form-control" id="numberOfPizzas" value="1" name="numBoxes" min="1" max="99" required>
        </div>
      </div>
      <div class="form-group row">
        <label class="col-form-label col-sm-2 text-sm-right" for="pizzaSizeSelection">Select a size:</label>
        <div class="col-sm-10 my-auto">
          <div class="form-check form-check-inline" id="pizzaSizeSelection">
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="pizzaSize" id="inlineRadio1" value="Extra-Large">
              <label class="form-check-label" for="inlineRadio1">Extra-Large</label>
            </div>
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="pizzaSize" id="inlineRadio2" value="Large" checked>
              <label class="form-check-label" for="inlineRadio2">Large</label>
            </div>
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="pizzaSize" id="inlineRadio3" value="Medium">
              <label class="form-check-label" for="inlineRadio3">Medium</label>
            </div>
            <div class="form-check form-check-inline">
              <input class="form-check-input" type="radio" name="pizzaSize" id="inlineRadio3" value="Small">
              <label class="form-check-label" for="inlineRadio3">Small</label>
            </div>

          </div>
        </div>
      </div>

      <div class="form-group row">
        <label class="col-form-label col-sm-2 text-sm-right" for="pizzaOptions">Special requests:</label>
        <div class="col-sm-10 my-auto">

          <div class="form-check form-check-inline">
            <input class="form-check-input" type="checkbox" name="pizzaOptions" value="Extra Cheese">
            <label class="form-check-label" for="pizzaOptions">
                            Extra Cheese</label>
          </div>

          <div class="form-check form-check-inline">
            <input class="form-check-input" type="checkbox" name="pizzaOptions" value="Roasted Garlic">
            <label class="form-check-label" for="pizzaOptions">
                            Roasted Garlic</label>
          </div>

          <div class="form-check form-check-inline">
            <input class="form-check-input" type="checkbox" name="pizzaOptions" value="Thick Crust">
            <label class="form-check-label" for="pizzaOptions">
                            Thick Crust</label>
          </div>

          <div class="form-check form-check-inline">
            <input class="form-check-input" type="checkbox" name="pizzaOptions" value="No Chilli">
            <label class="form-check-label" for="pizzaOptions">
                            No Chilli</label>
          </div>

          <div class="form-check form-check-inline">
            <label class="form-check-label" for="promoCode">
                            Promotional Code:</label>
            <input class="form-check-input" type="number" name="promoCode" id="promoCode" placeholder="XXXX">
          </div>
        </div>


        <div class="form-group row ">
          <div class="col-sm mx-auto d-flex justify-content-center ">
            <button type="submit" class="btn btn-primary" onclick="myFunction()">Submit</button>
          </div>

        </div>
    </form>
    </div>

    <!-- jQuery library -->
    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>
    <script type="text/javascript" src="9.3.js"></script>
</body>

</html>