Select returns an array

Topic: Select returns an array

master@mastersistemas.net pro asked 5 years ago

Hi, the select component returns an array, how can I get only the string?

getSelectAlterar= (value) => {

console.log(value);

varbancoAlterar=this.state.bancoAlterar;

bancoAlterar.nome=value;

this.setState({ bancoAlterar:bancoAlterar });

}

<Select getValue={this.getSelectAlterar}>

<SelectInputselected={this.state.bancoAlterar.nome}className="select"></SelectInput>

<SelectOptions>

<SelectOptionicon={brasil}>Banco do Brasil</SelectOption>

<SelectOptionicon={caixa}>Caixa</SelectOption>

<SelectOptionicon={carteira}>Carteira</SelectOption>

<SelectOptionicon={cresol}>Cresol</SelectOption>

<SelectOptionicon={viacredi}>Crevisc</SelectOption>

<SelectOptionicon={itau}>Itau</SelectOption>

<SelectOptionicon={santander}>Santander</SelectOption>

<SelectOptionicon={sicred}>Sicred</SelectOption>

<SelectOptionicon={sicoob}>Sicoob</SelectOption>

<SelectOptionicon={viacredi}>Viacredi</SelectOption>

<SelectOptionicon={outros}>Outros</SelectOption>

</SelectOptions>

</Select>

the console.log returns the selected item inside an array: Example: ["Cresol"] How can I get only one String?

Add comment

Mikołaj Smoleński staff answered 5 years ago

0 0 Best answer

Hi there, Please add value attribute to each SelectOption component. Then You should have a possibility to get value like I wrote above. Best Regards

Add comment

master@mastersistemas.net pro answered 5 years ago

0 0 Best answer

Hi, good afternoon, I tried this way, but only give me the first letter.

My code:
<pre class="code-toolbar grey lighten-2 p-3 mb-3">this.state = {

bancoAlterar:{agencia:"",ativo:0,ativodesc:"",codigo:"",conta:"",dv:"",id:0,nome:"",saldo:""},

}

getSelectAlterar = (Value) => {
var bancoAlterar =this.state.bancoAlterar;

bancoAlterar.nome =Value[0];

console.log(Value[0]);

this.setState({ bancoAlterar: bancoAlterar });

}

<SelectInput selected={this.state.bancoAlterar.nome}className="select"></SelectInput></pre>
<div>
<div>
<pre class="code-toolbar grey lighten-2 p-3 mb-3"><SelectOptions>
<SelectOption icon={brasil}>Banco do Brasil</SelectOption>

<SelectOption icon={caixa}>Caixa</SelectOption>

<SelectOption icon={carteira}>Carteira</SelectOption>

<SelectOption icon={cresol}>Cresol</SelectOption>

<SelectOption icon={viacredi}>Crevisc</SelectOption>

<SelectOption icon={santander}>Santander</SelectOption>

<SelectOption icon={sicred}>Sicred</SelectOption>

<SelectOption icon={sicoob}>Sicoob</SelectOption>

<SelectOption icon={viacredi}>Viacredi</SelectOption>

<SelectOption icon={outros}>Outros</SelectOption>

</SelectOptions>

</Select>
</pre>
</div>
</div>
<div>Return of the console:</div>
<div><a href="https://uploaddeimagens.com.br/imagens/c-png-fb27abf2-5661-47ae-b64c-1e7780e9fa2f" rel="nofollow">https://uploaddeimagens.com.br/imagens/c-png-fb27abf2-5661-47ae-b64c-1e7780e9fa2f</a></div>
<div></div>
<div>line:</div>
<div><a href="https://uploaddeimagens.com.br/imagens/d-png-4bfb6971-8b55-47f8-98ee-a8a3813fc1a1" rel="nofollow">https://uploaddeimagens.com.br/imagens/d-png-4bfb6971-8b55-47f8-98ee-a8a3813fc1a1</a></div>
<div></div>
<div>thanks in advance.</div>
<div></div>

Please insert min. 20 characters.

Hi, good afternoon, I tried this way, but only give me the first letter. My code:

this.state = {

bancoAlterar:{agencia:"",ativo:0,ativodesc:"",codigo:"",conta:"",dv:"",id:0,nome:"",saldo:""},

}

getSelectAlterar = (Value) => {
var bancoAlterar =this.state.bancoAlterar;

bancoAlterar.nome =Value[0];

console.log(Value[0]);

this.setState({ bancoAlterar: bancoAlterar });

}

<Select getValue={this.getSelectAlterar}>

<SelectInput selected={this.state.bancoAlterar.nome}className="select"></SelectInput>

<SelectOptions>
<SelectOption icon={brasil}>Banco do Brasil</SelectOption>

<SelectOption icon={caixa}>Caixa</SelectOption>

<SelectOption icon={carteira}>Carteira</SelectOption>

<SelectOption icon={cresol}>Cresol</SelectOption>

<SelectOption icon={viacredi}>Crevisc</SelectOption>

<SelectOption icon={itau}>Itau</SelectOption>

<SelectOption icon={santander}>Santander</SelectOption>

<SelectOption icon={sicred}>Sicred</SelectOption>

<SelectOption icon={sicoob}>Sicoob</SelectOption>

<SelectOption icon={viacredi}>Viacredi</SelectOption>

<SelectOption icon={outros}>Outros</SelectOption>

</SelectOptions>

</Select>

Return of the console:

https://uploaddeimagens.com.br/imagens/c-png-fb27abf2-5661-47ae-b64c-1e7780e9fa2f

line:

https://uploaddeimagens.com.br/imagens/d-png-4bfb6971-8b55-47f8-98ee-a8a3813fc1a1

thanks in advance.

Add comment

Mikołaj Smoleński staff answered 5 years ago

0 0 Best answer