0

estoy teniendo un problema con react y material ui donde estoy intentando generar varios textfield con un for segun el valor numerico en otro textfield, no habia tenido problema con esto con js vanilla, doy un ejemplo en vanilla hacia esto

dt = $("#dt").val();
if (dt == 0 || dt == "" || dt == null || dt == undefined) {
 dt = 1;
}
if (dt > 20) {
 dt = 20;
}
inputDt = "";
inputBu = "";
inputPe = "";
for (let i = 0; i < dt; i++) {
  inputDt += `<input type="text" class="form-control form-control-sm" placeholder="N° del 
  documento" required="" name="numDt[]" id="numDt">`;
  inputBu += `<input type="number" min="1" class="form-control form-control-sm" 
  placeholder="Cantidad bultos" required="" name="numBul[]" id="numBul" value="1">`;
  inputPe += `<input type='text' id='numPes' name="numPes[]" placeholder="kg" 
  autocomplete="off" class="form-control form-control-sm" required="" value="1"/>`;
}
$("#inputDt").html(inputDt);
$("#inputBu").html(inputBu);
$("#inputPe").html(inputPe);

al momento de enviar estos valores en el formulario con el nombre name='numBul[]' no generaba ningun problema, pero en react no me funciona ya que cuando agrego un valor en alguno de los generados todos se me cambian a ese o me sale "[object][object]"

este es el codigo react

Array.from({ length: formik.values.cantidadVehiculos }).map((_, index) => (
  <Grid key={index} xs={12} item container spacing={1}>
     <Grid item xs={3}>
        <Autocomplete
           disablePortal
           size="small"
           options={tipoVehiculo}
           onChange={(e, value) => {
             formik.setFieldValue('tipoVehiculo', value?.id || '');
           }}
           onOpen={formik.handleBlur}
           includeInputInList
           renderInput={(p) => (
            <TextField
              {...p}
              id="tipoVehiculo"
              name="tipoVehiculo"
              label="tipoVehiculo"
              error={formik.touched.tipoVehiculo && Boolean(formik.errors.tipoVehiculo)}
              helperText={formik.touched.tipoVehiculo && formik.errors.tipoVehiculo}
            />
           )}
         />
      </Grid>
))}

1 respuesta 1

0

usando la libreria Formik logre hacer listas de datos con un componente llamado por si tienen un problema en la propia pagina de Ejemplo

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.