Criando um Input Widget no Yii2 – Parte 3/3

Essa é a terceira e última parte da série de posts sobre Input Widget. Para entendimento total dessa série é necessário ler PARTE 1  e a PARTE 2 para que você consiga absorver todo o conteúdo de forma didática.

Parametrizando Widget

Nosso widget tá funcionando legal, bonitinho e tudo mais. Porém, vocês já perceberam que o id dos campos de endereço (logradouro, bairro, cidade e estado) estão “chumbados” no nosso widget? Isso não é muito legal pois vai sempre obrigar os campos de endereço a ter sempre o mesmo id.

O Ideal seria de alguma forma ser enviado para o nosso componente uma lista com o id de cada campo de endereço. Para isso, lá na invocação do nosso widget podemos passar uma lista de atributos para fazermos o que bem entendermos.

Na chamada do nosso Widget, vamos fazer as seguintes modificações:

Como você já deve ter visto na documentação (ficaria um pouco decepcionado com você caso não tivesse visto), o segundo parâmetro do método widget() é uma lista de configurações para serem usadas na classe do widget, onde a chave do array representa um atributo da classe.

Vamos modificar agora nossa classe MyCepInput adicionando um atributo para cada campo de endereço e com os mesmos nomes que colocamos nas chaves do array:

E vamos vincular os id’s dos campos passados por parâmetro no trecho de javascript, relacionando cada um dessa forma:

E dessa forma, temos o nosso componente parametrizado! Dessa forma, podemos inserir de forma dinâmica o id’s dos campos de endereço, deixando nosso componente mais flexível =D.

Espero que você tenha gostado dessa série de posts que fiz com muito carinho falando sobre Input Widgets. Compartilhe com seus amigos e não deixe de comentar aqui o que você achou, dúvidas, críticas, sugestões de melhorias e etc!

Um forte abraço e espero ter contribuído pelo menos um pouco nos seus estudos.

Kilderson Sena

Empreendedor, Experiente Analista e Desenvolvedor de Sistema e Líder de Equipes. Micro Empresário no ramo de Tecnologia, mas precisamente nos mercados de Desenvolvimento WEB, Desktop e Mobile.

Deixe uma resposta

This site uses Akismet to reduce spam. Learn how your comment data is processed.