Barra de ferramentas
Pesquisa predeterminada
- Exibir uma pesquisa predeterminada
Em 4D Ajax Framework v11 Release 1, as pesquisas predeterminadas podem ser exibidas em uma guia ou em uma nota em um enquadramento. Este exemplo mostra como definir e mudar as opções de visualização de pesquisas dentro de um objeto de dados.
Cabeçalho e rodapé de página
- Controles de filas de cabeçalho e pé de página
Este exemplo utiliza vários comandos novos do 4D Ajax Framework v11 Release 1 para personalizar melhor às linhas de cabeçalho e rodapé de página na rede. Uma mudança importante é que todas as filas na rede, agora podem mostrar texto ajustado.
Arrastar e soltar
- Arrastar e soltar objetos
O data grid em 4D Ajax Framework v11 Release 1 têm integrado às funcionalidades de arrastar e soltar. Este exemplo mostra 3 formas diferentes de arrastar e soltar objetos entre dois data grids.
Manipulação de colunas
O API JavaScript do 4D Ajax Framework pode ser utilizado para realizar um número de tarefas sobre colunas no data grid. Há três exemplos diferentes:
- Bloqueio de colunas
Este exemplo mostra como bloquear uma coluna de um data grid. Esta característica permite ao usuário mudar de lugar horizontalmente de esquerda à direita, enquanto isso permanece visível uma coluna bloqueada.
- Controle de visualização de colunas
Este exemplo mostra como visualizar e ocultar colunas selecionadas do data grid.
- Redimensionamento de colunas
Este exemplo mostra como manipular o tamanho de uma coluna de um data grid.
Estilo CSS e células
- Estilos de células independentes
O data grid em 4D Ajax Framework v11 Release 1 suporta estilos de células independentes. Esta característica permite ao desenvolvedor mudar dinamicamente ou invalidar estilos para toda a célula, fila ou coluna.
Edição on-line
- Ativar e desativar a edição on-line
Data Grid 2.0 permite aos usuários modificar um registro na área de um data grid. Este exemplo mostra três dos novos comandos de edição on-line.
Controle de imagem
- Pré-visualização de imagens ao passar o mouse "Hovering"
Anteriormente, para mostrar uma imagem em um data grid, você tinha que clicar nela e abrir uma nova janela. Agora, pode mover seu ponteiro sobre um link e pré-visualizar a imagem sem ter que clicar para vê-la.
- Eventos hover
Este exemplo amplia o primeiro demo de pré-visualização de imagens ao passar o mouse “Hovering”, acrescentando alguns eventos adicionais a manipulação da imagem.
Eventos
- On Column Click
onDataColumnClick (11.1) é um evento que é disparado ao clicar sobre o cabeçalho de coluna. Este exemplo mostra como executar um código javascript quando este evento é disparado.
- On Row Click
onDataRowClick (11.1) é um evento que é disparado ao clicar em uma linha. Este exemplo mostra como executar um código javascript quando este evento é disparado.
- On Cell Click
onDataCellClick (11.1) é um evento que é disparado ao clicar em uma célula de um data grid. Este exemplo mostra como executar um código javascript quando este evento é disparado.
- On Row Double Click
onDataRowDblClick (11.2) é um evento que é disparado ao fazer clique duplo em uma linha. Este exemplo mostra como executar um código javascript quando este evento é disparado.
- On Cell Double Click
onDataCellDblClick (11.2) é um evento que é disparado ao fazer clique duplo em uma célula de um data grid. Este exemplo mostra como executar um código javascript quando este evento é disparado.
Drag and Drop
- Cesta de compras
Este exemplo mostra como criar uma cesta de compras utilizando objetos do 4D Ajax Framework. Esta página usa 3 data grids: um para mostrar a lista de produtos, um para o nosso ícone e um para mostrar a lista atual da cesta de compras. Os objetos podem ser arrastados da lista de produtos e serem soltos no data grid da cesta de compras. Quando isso acontece, o conteúdo da cesta de compras será atualizado de acordo com algumas regras que nós definirmos.
Variáveis personalizadas
- Concessionária de carros
Este exemplo mostra como usar valores personalizadaos no 4D Ajax Framework. Os valores personalizados são enviados a partir da página web (frontend) e são recebidos no banco de dados 4D (backend). O banco de dados 4D (backend) realiza uma consulta e envia os valores personalizados de volta para a página (frontend) que, por sua vez, formata os dados e os exibe na página.
Bridge - Manipulação de registros (11.2)
- Adicionar registro
Este exemplo mostra como usar o comando dax_bridge.addRecord para adicionar registros ao banco de dados 4D (backend) através de um layout HTML de entrada personalizado.
- Adicionar registros em lote
Este exemplo mostra como usar o comando dax_bridge.addRecordBatch (novo em v11.2) para adicionar múltiplos registros ao banco de dados 4D (backend) através de um layout HTML de entrada personalizado.
- Modificar registro
Este exemplo mostra como usar o comando dax_bridge.modifyRecord para modificar um registro no banco de dados 4D (backend) através de um layout HTML de entrada personalizado.
- Excluir registro
Exclua um ou mais registros através do comando dax_bridge.deleteRecords
Bridge - Acesso aos dados
- Lista de seleção
Exibe e acessa uma lista de seleção através do comando dax_bridge.getChoiceList.
- Obter registro
Este exemplo mostra como usar o comando dax_bridge.getRecord command para obter registros do banco de dados 4D (backend).