0

Tengo una funcion con la cual quiero validar si los datos que se estan pasando como parametros estan vacios; si estan vacios se convierte en 0 en caso contrario pasa el valor que se le envia.

validar(){
    this.setState({nombre:"", apellido:"", email:""});

    if( this.state.tipo_contacto == 1){
        this.state.id = "/0";
        this.state.value = "/"+ 1;
        if(document.getElementById('nombre').value != ""){
            this.state.nombre = "/"+ ascii_to_hexa(document.getElementById('nombre').value);
        }else{
            this.state.nombre = "/0";
        }
        if(document.getElementById('apellido').value != ""){
            this.state.apellido = "/"+ ascii_to_hexa(document.getElementById('apellido').value);
        }else{
            this.state.apellido = "/0";
        }
        if(document.getElementById('email').value != ""){
            this.state.email = "/"+ ascii_to_hexa(document.getElementById('email').value);
         }else{
            this.state.email = "/0";
         }    
    }
 }

 getSearchPerson(){
    this.validar();
    CleverRequest.get(CleverConfig.getApiUrl('profile')+'/clientes/filtroparametroscontac/' +  this.props.value + '/' + this.state.id +  '/' + this.state.name + '/' + this.state.apellido + '/' + this.state.email + '/' + this.state.limit + '/' + this.state.offset,(response,error) => 
    {
        if(!error)
        {
            this.setState({
                getSearchEmpresa : response,
            })
        }else
        {
            console.log(error);
        };
    });
}

Ese es mi codigo pero no funciona y no se que estoy haciendo mal. Espero me puedan ayudar.

1
  • Cuando dices que tu código no funciona, ¿qué ocurre? ¿está arrojando algún error? o crees que hay fallos en la lógica de implementación? Revisando tu código puedo ver que estás asignándole un valor al state directamente y no por medio de .setState cosa que reactjs recomienda que no hagas y otra cosa que veo es la forma en la que llamas el atributo value de cada input cuando podrías hacerlo todo con react y hacer tu código más escalable Commented el 28 mar. 2019 a las 20:28

1 respuesta 1

0

Haré una respuesta sin saber bien el problema que tienes, pero al ayudarte a refactorizar el código y a entender un poco más el funcionamiento de entonces podrás solucionar más rápido, y seguro te ayude a aclarar mucho.

Lo primero que veo, es la forma en la que usas tus inputs, y cuando te menciono que puedes hacer el código más escalable, es porque puedes bindear una función a tus inputs para luego no tener que buscarlos en el DOM (Esto es algo importante de las tecnologías reactivas y la velocidad del DOM), para ello puedes hacer esto:

<!-- defines tu input en html normal !-->
<input name="nombre" onChange={this.onChangeInput.bind(this)} />

Le hacemos bind al método onChange para que cada que cambie llame a una función que vas a definir en tu componente, como le pusimos onChangeInput entonces la llamamos igual:

// En algún lado de tu componente, donde defines tus métodos
onChangeInput(event) {
    // 'event' es el evento nativo, el cual tiene un objetivo (target)
    // que viene siendo el nodo en el DOM (O sea, el input que definimos antes),
    // por lo que podemos llamar al atributo 'name' (que lo definimos),
    // y el atributo 'value' (lo mismo que document.getElementById('nombre').value)
    this.setState({ [event.target.name]: event.target.value });
}

Con [event.target.name] : event.target.value le decimos a react que guarde en el estado una nueva llave con el nombre del input que cambió, y le setee el valor que el usuario escogió en el input. Fácil :)

Ahora tu método de validación. Lo explicaré en el código:

validate() {
  // OJO que comenté esto
  // this.setState({ nombre: '', apellido: '', email: '' });
  // Lo comento porque no sé la razón de tenerlo, además que los inputs tomarán esos valores,
  // y si no lo comento, entonces la validación no servirá, pero si necesitas limpiar
  // estos valores antes de validar, siempre puedes crear unos adicionales, o llamar
  // a tus inputs con un prefijo. Por ejemplo 'input_nombre'

  if (this.state.tipo_contact === 1) {  // usa === en vez de ==
    this.setState({
      id: "/0",
      value: "\1",
      nombre: this.state.nombre.trim() ? `/${ascii_to_hexa(this.state.nombre)}` : '/0',
      apellido: this.state.apellido.trim() ? `/${ascii_to_hexa(this.state.apellido)}` : '/0',
      email: this.state.email.trim() ? `/${ascii_to_hexa(this.state.email)}` : '/0',
    });
  }
}

Básicamente cuando valida está asignándole a cada variable un '/0' si está vacío o el valor de acuerdo a la función ascii_to_hexa si tiene un valor.

Como te repito, no sé si esto dé con la solución a tu pregunta y respuesta, pero si puede ser gran causa del problema, y puede que el código que puse aquí no te funcione tal cual, más si necesitas tener en variables diferentes el valor del input y por otro lado el valor que asignas con tu función de ascii_to_hex, pero básicamente, la corrección que había que hacerle a tu código fuera de la lógica, era la forma como asignabas los valores al estado.

Cualquier pregunta o inquietud que tengas me comentas y con gusto te ayudaré a resolverla

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.