Build a Customer Complaint Form - Build a Customer Complaint Form

Tell us what’s happening:

My isValid function is not passing test 30. What am I missing>

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: script.js */

  const regex = {
  emailRegex: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.com$/,
  orderRegex: /^2024\d{6}/,
  codeRegex: /^[a-zA-Z]{2}\d{2}-[a-zA-Z]\d{3}-[a-zA-Z]{2}\d$/
}
  const fullName = document.getElementById("full-name");
  const email = document.getElementById("email");
  const orderNo = document.getElementById("order-no");
  const productCode = document.getElementById("product-code");
  const quantity = document.getElementById("quantity");
  const complaintsGroup = document.querySelectorAll("#complaints-group input[type='checkbox']");
  const complaintDescription = document.getElementById("complaint-description");
  const solutionsGroup = document.querySelectorAll("#solutions-group  input[type='radio']");
  const solutionDescription = document.getElementById("solution-description");

function validateForm() {

  let object = {
    "full-name": false,
    email: false,
    "order-no": false,
    "product-code": false,
    quantity: false,
    "complaints-group": false,
    "complaint-description": false,
    "solutions-group": false,
    "solution-description": false
  }

  if (fullName.value !== "") {
    object["full-name"] = true;
  }
  if (regex["emailRegex"].test(email.value)) {
    object["email"] = true;
  }
  if (regex["orderRegex"].test(orderNo.value)) {
    object["order-no"] = true;
  }
  if (regex["codeRegex"].test(productCode.value)) {
    object["product-code"] = true;
  }
  if (quantity.value > 0) {
    object.quantity = true;
  }

  for (const input of complaintsGroup) {
    if (input.checked) {
      object["complaints-group"] = true;
    }
  }
  if (document.getElementById("other-complaint").checked) {
    if (complaintDescription.value.length >= 20) {
      object["complaint-description"] = true;
    } 
    else {
      object["complaint-description"] = false;
    }
  }

  for (const input of solutionsGroup) {
    if (input.checked) {
      object["solutions-group"] = true;
    }
  }

  if (document.getElementById("other-solution").checked) {
    if (solutionDescription.value.length >= 20) {
      object["solution-description"] = true;
    } 
    else {
      object["solution-description"] = false;
    }
  }
  return object;
}

function isValid() {
  const validationResult = validateForm();

  const values = Object.values(validationResult);
  return values.every(value => value === true);
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36

Challenge Information:

Build a Customer Complaint Form - Build a Customer Complaint Form

Use console.log() to log the inputs that the automated tests are sending.

Then log the result of your isValid function.

Review the logs to see which inputs are causing an incorrect result.

Are you adding the handlers in the HTML? Where are your event listeners?