Criado botão Ajax

O botão de ação do tipo ajax cria um evento ajax do tipo onClick possibilitando a execução de rotinas sem a necessidade de recarregar a aplicação.

Exemplo do botão de ação na aplicação

Veja abaixo como criar e configurar este tipo de botão.

Criando um botão

Na tela da lista de botões clique em Criar Novo botão.

Dados do botão

Em seguida, selecione o Tipo e informe o nome do botão.

O campo nome permite apenas números, letras sem acentuação e underscore.

Visual do botão

Nesta tela será definido o visual do botão para exibição da aplicação.

Tipo do display

Este atributo define o formato de exibição da ligação.

Algumas opções da interface são exibidas de acordo com o tipo do display utilizado.

As opções são:

FontAwesome

Valor padrão do atributo, permite utilizar Font Awesome para definição do ícone.

Botão

Exibe o item na barra de ação como um botão. Ao utilizar este atributo, será exibido uma nova configuração, Formato de Botão, que definirá o formato de exibição do botão será exibido, onde devemos definir a exibição do botão com:

• FontAwesome - Exibe apenas FontAwesome
• Texto - Exibe apenas texto
• Font Awesome e texto - Exibe FontAwesome e texto, posicionando o ícone a esquerda.
• texto e Font Awesome - Exibe FontAwesome e texto, posicionando o ícone a direita.

Imagem

Permite selecionar uma imagem do gerenciador de imagem para definição do ícone.

Texto

Exibe um texto no formato de link.

ID

Define o nome do estado do botão.

Este texto não aceita langs ou variáveis para sua definição

Font Awesome

Define o ícone que será exibida na aplicação ao selecionar o Tipo do display como FontAwesome

Exemplo do botão de ação como imagem Font Awesome

Imagem

Define a imagem que será exibida na aplicação ao selecionar o Tipo do display como imagem.

Clique no ícone para abrir o [gerenciador de imagens][link_gerenciador_img]{:target=”_blank”} e selecione a imagem desejada.

Exemplo do botão de ação como imagem

Texto

Define o texto do link que será exibido na aplicação ao selecionar o Tipo do display como Texto

A definição do texto não possui nenhuma restrição de caractere e pode ser realizada com um texto fixo ou utilizando uma lang, para criação de sistemas com múltiplos idiomas.

Veja mais detalhes sobre as langs e sobre nosso Dicionário de Dados.

Exemplo do botão de ação como Texto

Cor

Define a cor do ícone do Font Awesome. Caso nenhum valor seja informado, o ícone assume a cor definida na configuração geral do [visual da barra de ação][link_editar_visual]{:target=”_blank”}.

Exibido apenas ao utilizar o Tipo do display como FontAwesome

Cor (Hover)

Define a cor do ícone do Font Awesome no estado hover, ao posicionar o mouse sobre o ícone.

Disponível ao selecionar Tipo do display como FontAwesome.

Cor (Active)

Define a cor do ícone do Font Awesome no estado ativo.

Disponível ao selecionar Tipo do display como FontAwesome.

Visual do botão

Este atributo define a cor do botão. Você pode selecionar uma cor na lista ou usar a opção de Tema para herdar o layout do botão utilizado em sua aplicação.

Disponível apenas ao selecionar Tipo do display como Botão.

Visual do botão (Hover)

Este atributo define a cor do botão no foco do botão. Você pode selecionar uma cor na lista ou usar a opção de Tema para herdar o layout do botão utilizado em sua aplicação.

Disponível apenas ao selecionar Tipo do display como Botão.

Hint

Define o texto de ajuda do botão.

A definição do texto não possui nenhuma restrição de caractere e pode ser realizada com um texto fixo ou utilizando uma lang, para criação de sistemas com múltiplos idiomas.

Veja mais detalhes sobre as langs e sobre nosso Dicionário de Dados.

Mensagem de confirmação

Texto de confirmação acionada ao clicar no ícone da barra de ação.

Exemplo da mensagem de confimação

A definição do texto não possui nenhuma restrição de caractere e pode ser realizada com um texto fixo ou utilizando uma lang, para criação de sistemas com múltiplos idiomas.

Veja mais detalhes sobre as langs e sobre nosso Dicionário de Dados.

Excluir

Apaga um estado do botão.

Botão Adicionar Estado

Adiciona uma linha para a configuração de um novo estado para botão ajax.

Estes estados podem ser manipulados utilizando a macro sc_actionbar_state no evento ajax.

Após adicionar os estados desejados e configurar o visual dos botões, clique em Salvar botão e configurar ajax para criar o botão e o evento.

Evento Ajax

Será criado o evento ajax, que será executado no onClick do botão.

Neste evento devemos codificar os procedimentos que desejamos realizar. Foram adicionadas algumas macros para a manipulação dos botões de ação:

Confira também algumas macros criadas exclusivamente para manipulação desses botões

Macro	Botão Ajax	Botão Ligação	Descrição
sc_actionbar_clicked_state			Recupera o estado atual do botão para realizar a troca do estado nos botões ajax.
sc_actionbar_state			Muda o stado atual do botão para um novo estado.
sc_actionbar_disable			Desabilita um botão da barra de ação.
sc_actionbar_enable			Habilita um botão da barra de ação, desabilitado pela macro sc_actionbar_disable.
sc_actionbar_hide			Esconde um botão da barra de ação.
sc_actionbar_show			Exibe um botão escondido com a macro sc_actionbar_hide.