A consulta de CNPJ é uma tarefa comum para empresas e profissionais que lidam com informações empresariais. Neste artigo, vamos explorar um código HTML, CSS e JavaScript que permite realizar essa consulta de forma fácil e intuitiva em uma página da web.

O código começa com a estrutura básica de um documento HTML. Ele inclui os links para as bibliotecas externas necessárias, como o Bootstrap e o Select2. Essas bibliotecas fornecem estilos pré-definidos e funcionalidades avançadas que facilitam o desenvolvimento da interface da página.

Em seguida, temos o corpo do documento, que é dividido em seções. A primeira seção apresenta um cabeçalho com o título "Consulta CNPJ" no centro da página. Logo abaixo, existem três campos de entrada: um seletor de busca por CNAE, um campo de texto para busca por CEP e um campo numérico para especificar a quantidade de CNPJs a serem retornados.

Após os campos de entrada, há um botão "Exportar CSV" que permite ao usuário exportar os resultados da consulta em um arquivo CSV. Em seguida, temos uma tabela vazia que será preenchida com os resultados da consulta.

No final do documento, encontramos as tags <script>, onde está o código JavaScript responsável pela funcionalidade da página. O código está dividido em várias funções que são chamadas em diferentes momentos.

A função exportTableToCSV é responsável por exportar os dados da tabela para um arquivo CSV quando o botão "Exportar CSV" é clicado. Ela percorre as linhas da tabela e coleta os valores de cada célula, montando uma string CSV que é baixada como um arquivo.

A função downloadCSV cria um link de download para o arquivo CSV gerado pela função anterior. Essa função é chamada internamente pela função exportTableToCSV.

Dentro do bloco $(document).ready(function() { ... }), encontramos o código JavaScript que é executado quando o documento é carregado. Primeiro, inicializamos o seletor de busca por CNAE com a biblioteca Select2, aplicando o tema Bootstrap.

Em seguida, utilizamos a função $.ajax para fazer uma requisição assíncrona para uma API que retorna a lista de CNAEs disponíveis. As informações de autenticação são enviadas nos cabeçalhos da requisição.

Quando a resposta da API é recebida, as opções do seletor de busca por CNAE são preenchidas dinamicamente com base nos dados retornados.

Além disso, existe um evento de mudança associado ao seletor de busca por CNAE. Quando um CNAE é selecionado, outra requisição assíncrona é feita para buscar os CNPJs relacionados ao CNAE selecionado. Novamente, as informações de autenticação são enviadas nos cabeçalhos da requisição.

Os CNPJs retornados pela API são então adicionados à tabela na página. Antes de adicionar os dados, verificamos se a tabela já possui dados anteriores e os removemos, para evitar duplicações. Cada CNPJ é inserido como uma nova linha na tabela, com suas respectivas informações exibidas em cada coluna.

Além disso, existe um evento associado ao campo de busca por CEP. Quando o usuário digita um CEP e sai do campo (evento "focusout"), uma requisição é feita à API para buscar os CNPJs relacionados ao CEP especificado, considerando também o CNAE selecionado e a quantidade desejada. Os CNPJs retornados são adicionados à tabela da mesma forma que no caso do seletor de busca por CNAE.

Em resumo, o código apresentado neste artigo é um exemplo de como criar uma página da web que permite a consulta de CNPJ com base em critérios como CNAE e CEP. Ele utiliza bibliotecas populares, como Bootstrap e Select2, para melhorar a aparência e a usabilidade da página. Além disso, o código consome uma API externa para buscar os dados de CNPJ e exibi-los em uma tabela na página. Os resultados também podem ser exportados para um arquivo CSV. Esse código serve como um ponto de partida para o desenvolvimento de um sistema de consulta de CNPJ mais completo e personalizado, com a possibilidade de adicionar mais funcionalidades e melhorias conforme necessário.

Portanto, ao implementar esse código em seu projeto, você terá uma interface amigável que permitirá aos usuários realizar consultas de CNPJ com facilidade, obtendo os resultados desejados de forma rápida e eficiente.

Baixe um exemplo prático

Deixe uma estrela!