Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

119
Vistas
Error with dynamically mapped radio group

I'm trying to dynamically map a radio group from a JSON file. I've got that bit figured out but the issue is I can't seem to add a label to each radio without getting an error. The error is ") expected". I think it's because the div tag is outside the mapping but I'm not sure. Here is the code for the radio group

  <div onChange={this.onChangeValue}>          
            {candidateData.map((candidate) => (
                <input type="radio" value={candidate.name} name={candidate.name}/> This is where I want to add the label that throws an error
            ))}
      </div> 

Here is the JSON

{
"candidates":[
            {
              "name":"Uncle Ruckus",
              "politics":"R-District 21",
              "img":"./Candidates/uncleruckus.jpg"
            },
            {
              "name":"Uncle Ruckus",
              "politics":"R-District 21",
              "img":"./Candidates/uncleruckus.jpg"
            }
          ]
}

I hope that makes sense. I'm happy to clarify anything. Thanks in advance.

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Wrap your input with a react fragment(<Fragment> </Fragment> ) or empty (<></>) tag

 {candidateData.map((candidate) => (
     <>
        <input type="radio" value={candidate.name} name={candidate.name}/> 
        This is where I want to add the label 
     </>
  ))}
      
about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda