Hello everybody I am working in a LWC trying to show and hide two fields when one is filled with data the other one is hided. And if this filled field is erased the other one appears. And vice versa. So in my .js I have this:
ocultarCamposNombrePrimerApellido= false;
handleRazonSocial(event){
this.razonSocial = event.detail.value;
console.log('razon social---'+ this.razonSocial);
if(!this.razonSocial){
this.ocultarCamposNombrePrimerApellido = false;
console.log('false');
}
if(this.razonSocial != null){
this.ocultarCamposNombrePrimerApellido = true;
console.log('true');
}
}
ocultarCampoRazonSocial=false;
handleNombre(event){
this.nombre = event.detail.value;
if(this.nombre != null && this.primerApellido != null){
this.ocultarCampoRazonSocial = true;
}else{
this.ocultarCampoRazonSocial = true;
}
}
and in my .html:
<template if:false={ocultarCamposNombrePrimerApellido}>
<lightning-input type="text" label="Primer Apellido" max-length="45" required name="primerApellido" onchange={handlePrimerApellido}></lightning-input>
<lightning-input type="text" label="Segundo Apellido" max-length="45" name="segundoApellido" onchange={handleSegundoApellido}></lightning-input>
</template>
<template if:false={ocultarCamposNombrePrimerApellido}>
<lightning-input type="text" label="Nombre" max-length="45" required name="nombre" onchange={handleNombre}></lightning-input>
</template>
At the begining the fields are showed correctly but when I fill one field and erase its value to nothing the other fields does not appear. Can anybody tell me where is the issue? Thanks.
