Selecionando um item em um ComboBox no Flex
Uma funcionalidade que eu senti falta (e que causou muita dificuldade) quando comecei a programar em Flex foi no uso do ComboBox. Eu precisava selecionar um determinado item em uma lista baseado no seu label. Fiquei frustrado ao descobrir que a propriedade selectedLabel era read-only (somente leitura)! Seria a solução dos meus problemas.
Cheguei a encontrar artigos que propunham a criação de um novo componente, só para implementar essa funcionalidade. Obviamente, como estava começando, só tentei criar o tal componente, sem sucesso.
Esses dias me deparei com a mesma necessidade, e como a gente vai aprendendo uns “caminhos alternativos” através da experiência, cheguei a uma alternativa: criar um loop que procure no dataProvider do ComboBox o Label desejado, e depois definir a propriedade selectedItem com o objeto vindo do loop.
Calma, vou explicar melhor, usando um exemplo. Considere o trecho de código a seguir:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute" width="221" height="124">
<mx:Script>
<![CDATA[
[Bindable]
private var frutas:Array = new Array(
{data:1, label:"Laranja"},
{data:2, label:"Melancia"},
{data:3, label:"Uva"},
{data:4, label:"Banana"},
{data:5, label:"Melão"}
);
]]>
</mx:Script>
<mx:ComboBox id="combo" x="40.5" y="76"
dataProvider="{frutas}" width="144">
</mx:ComboBox>
<mx:Button x="80" y="27" label="Uva"/>
</mx:Application>
O resultado é o seguinte:
A idéia é que, após clica no botão “Uva”, o item correspondente seja selecionado no combo.
Esse exemplo bem simples é uma situação muito comum de encontrar, principalmente em aplicações onde o usuário grava no banco alguma informação selecionada nestes combos.
Bom, até aqui o programa não faz nada de útil, mas vamos acrescentar algumas funções. Primeiro, quando o botão for clicado, ele definir o Item que será selecionado no Combo. Alteramos a definição do nosso botão:
<mx:Button x="80" y="27" label="Uva"
click="{combo.selectedItem = selecionarItem('Uva')}"/>
E criamos a função que vai retornar o Objeto que deve ser selecionado:
private function selecionarItem ( fruta:String ):Object {
for ( var cont:int = 0; cont < frutas.length; cont++ ) {
if (frutas[cont]['label'] == fruta) {
return frutas[cont];
}
}
return null;
}
Pronto! Não é tão elegante quanto criar um componente customizado, mas quando se tem o acesso ao dataProvider como no exemplo citado, é uma alternativa possível.
Veja a “aplicação” funcionando.
Edit @ 17ago08
Eu escrevi um post com uma versão melhorada desse exemplo aqui.
Poderia avaliar este artigo, por favor? |
 (Nenhum voto) Loading ... |
Pingback: Elvis Fernandes » Blog Archive » Selecionando um item em um ComboBox II