Construir un Formulario de Quejas de Clientes - Cree un formulario de quejas de clientes

Curriculum Help
1

Cuéntanos qué está pasando:

Hello,

It seems the program does what it’s supposed to, but it gives me errors in 9, 10, 22, 23, 32, and 34.

Tu código hasta el momento

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


/* file: styles.css */


const nameInput=document.getElementById('full-name');
const mail=document.getElementById('email')
const  orderProducto=document.getElementById('order-no')

const codigoProducto=document.getElementById('product-code')
const cantidad=document.getElementById('quantity')
const other=document.getElementById('other-complaint')
const contenedorComplaints=document.getElementById('complaints-group')
const descripcionComplaints=document.getElementById('complaint-description')
const grupoSolucion=document.getElementById('solutions-group')
const descripcionSolution=document.getElementById('solution-description')
const otherSolution=document.getElementById('other-solution')
const btnSubmit=document.getElementById("submit-btn")
const formulario=document.getElementById("form")

function isValidName(){
    let isValid= nameInput.value!='';
    if (isValid==true){nameInput.style.borderColor="green"}else{nameInput.style.borderColor="red"}
        return isValid;

    }
function isValidEmail(){
  let patron=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/;
  let isValid= patron.test(mail.value);
  if (isValid==true){mail.style.borderColor="green"}else{mail.style.borderColor="red"}
  return isValid;
  }
function isValidOrder(){
  let patron=/^2024\d{6}$/;
  let isValid=patron.test(orderProducto.value);
  if (isValid==true){orderProducto.style.borderColor="green"}else{orderProducto.style.borderColor="red"};
  return isValid}
function isValidCodigo(){
  let patron=/^[A-Za-z]{2}\d{2}[A-Za-z]\d{3}[A-Za-z]{2}\d$/;
  let isValid= patron.test(codigoProducto.value);
  if (isValid==true){
    codigoProducto.style.borderColor="green" ;return true}else{
      codigoProducto.style.borderColor="red"
      return false}
  }
function isValidCantidad(){ 
  let isValid= Number.isInteger(Number(cantidad.value)) && cantidad.value>0;
  if (isValid==true){cantidad.style.borderColor="green"}else{cantidad.style.borderColor="red"};
  return isValid}

function isValidCheck(){
    const seleccionados = document.querySelectorAll('input[name="complaint"]:checked');
    let isValid= seleccionados.length>0;
    if (isValid==true){contenedorComplaints.style.borderColor="green"}else{contenedorComplaints.style.borderColor="red"}
    return isValid;
  
  }
function isValidDescription(){
    let isValid= descripcionComplaints.value.length>=20;
    if (other.checked==true){
    if (isValid==true){descripcionComplaints.style.borderColor="green";return true}else{descripcionComplaints.style.borderColor="red";return false}}
    else{descripcionComplaints.style.borderColor="black";return true};
    }
function isValidSolution(){
    let isValid= descripcionSolution.value.length>=20;
    if (otherSolution.checked==true){
    if (isValid==true){descripcionSolution.style.borderColor="green";return true}else{descripcionSolution.style.borderColor="red";return false}}
    else{descripcionSolution.style.borderColor="black";return true};
    
    }    
function isValidRadio(){
    const seleccionados = document.querySelectorAll('input[name="solutions"]:checked');
    isValidSolution();
    let isValid= seleccionados.length>0;
    if (isValid==true){grupoSolucion.style.borderColor="green";
    return true}else{grupoSolucion.style.borderColor="red";
    return false};
    
    }
function validateForm(){
  const objeto ={ 
    'full-name' : isValidName(),
    'email' : isValidEmail(),
    'order-no':isValidOrder(),
    'product-code' :isValidCodigo() ,
    'quantity': isValidCantidad(),
    'complaints-group' :isValidCheck(),
    'complaint-description' : isValidDescription(),
    'solution-group' : isValidRadio(),
    'solution-description':isValidSolution()
    }
    return objeto;
}
function isValid(objeto){
  const vector=Object.values(objeto);
  return vector.every(valor => valor==true)
}


descripcionSolution.addEventListener("input",isValidSolution)
grupoSolucion.addEventListener("change",isValidRadio)
descripcionComplaints.addEventListener("input",isValidDescription)
contenedorComplaints.addEventListener("change",isValidCheck)
other.addEventListener("change",isValidDescription)
cantidad.addEventListener("change",isValidCantidad)
codigoProducto.addEventListener("change",isValidCodigo)
orderProducto.addEventListener("change",isValidOrder)
mail.addEventListener("change",isValidEmail)
nameInput.addEventListener("change",isValidName)
btnSubmit.addEventListener("click",(event) =>{
event.preventDefault();
console.log(validateForm())

if (isValid(validateForm())){formulario.submit()}})

Información de tu navegador:

El agente de usuario es: Mozilla/5.0 (X11; Linux x86_64; rv:151.0) Gecko/20100101 Firefox/151.0

Información del Desafío:

Construir un Formulario de Quejas de Clientes - Cree un formulario de quejas de clientes

GitHub Link: i18n-curriculum/curriculum/challenges/espanol/blocks/lab-customer-complaint-form/67279fe50237291f80eed8b8.md at main · freeCodeCamp/i18n-curriculum · GitHub

2

Hi @tirsote,

Your code was too long to be automatically inserted by the help button.

Please update the message to include your code, formatted as follows:

There are two ways you can format your code to make it easier to read and test:

  1. After you copy/paste your code into the editor, select it by dragging your cursor over it then click the (</>) button in the toolbar to automatically wrap your code in backticks. (You can click on the animated demo image below to enlarge it.)

1356×380 401 KB

  1. Manually add three backticks on a new line above your code and on a new line after your code. Note that a backtick is NOT the same as a single quote('). To find the backtick key on your keyboard, see this post.

To see changes to your post as you make them, you can click the (M+) button on the toolbar to bring up the rich text editor:

image
image482×117 7.55 KB

Happy coding