Inserir Tabela no Formulário Apps Script Filtro de Pedidos - Planilha Google - Aula 09

Inserir Tabela no Formulário Apps Script Filtro de Pedidos - Planilha Google - Aula 09 Nesta aula vamos Inserir a tabela html no nosso formulário beleza pessoal então vamos para o editor de script no editor acessem o arquivo filtro pedido traço JS e antes de inserir a tabela.

Inserir Tabela no Formulário Apps Script Filtro de Pedidos - Planilha Google - Aula 09

HTML nós vamos fazer um ajuste na função cidades neste if faltou eu trocar o arroz produtos pelo ar Ray cidades então vocês vão pegar o arroz cidades e colocar no lugar.

Produtos feito este ajuste Já podemos Inserir a tabela html Então agora vocês vão acessar o arquivo filtro pedidos ponto html Desce Até depois nos botão de comando e.

O primeiro passo é colocar uma dívida que vai conter a tabela então menor objeto Divino e de igual e abre e fecha aspas duplas eu vou chamar está livre de tabela.

Fora nas raspas duplas maior abrimos a diva precisamos fechar menor barra Dive e fecha com o maior e dentro desta dívida nós vamos colocar o objeto table então menor objeto table.

E de igual e abre e fecha aspas duplas eu vou chamar esta tabela de Tap fora das aspas duplas igual e abre e fecha aspas duplas eu vou colocar.

98% da área do formulário fora das duplas comando border igual e abre e fecha aspas duplas eu vou colocar uma linha de borda de um pixel fora das duplas comando céu céu peidei.

Igual e abre e fecha aspas duplas também um pixel fora das raspas duplas maior abrimos o objeto tabela precisamos.

Fechar então menor barra table e fecha com o maior próximo passo é colocar o cabeçalho da tabela então menor comando territz maior abrimos o cabeçalho precisamos fechar.

Então menor barra comando terride e fecha com o maior e dentro do cabeçalho nós vamos ter uma linha que vai ser o objeto ter então menor objeto terra e fecha com o maior.

Abrimos a linha precisamos fechar então menor barra terra e fecha com o maior e dentro da linha nós vamos ter os cabeçalhos de cada coluna então menor um objeto th.

Th maior e aí vem o caption da coluna agora pessoal nós precisamos colocar a ordem das colunas que nós temos na guia pedidos Então a primeira coluna é a coluna ID depois coluna perdido data.

Veja Também:

    Mês e ano nós não vamos colocar na

    Tabela vai a sequência linha produto qtd preço unidade Total cliente vendedor Eu ainda tenho estado cidade status e.

    Observação de volta no editor depois do maior primeira coluna coluna e de para fechar a coluna menor barra th e fecha com maior.

    Para as demais colunas podemos aproveitar esta linha de código depois do id eu tenho o pedido eu vou colocar pé de ponto Cola depois do pedido vai ser a coluna.

    Data data Depois da data vai ser a linha linha prosseguindo vem a coluna produto depois do produto é a quantidade.

    Que te dê depois da quantidade é o preço unidade eu vou colocar pponto unitinta depois do preço unidade é a coluna total.

    Depois do cliente é o vendedor após o vendedor é o estado e depois do Estado a cidade com uma cidade cidade.

    Após a cidade coluna status e por fim nós vamos ter a coluna observação observação beleza colocamos todas as colunas deixa.

    Eu dar uma ajeitada para facilitar a visualização Ok colocamos a tabela HTML agora nós precisamos definir o estilo da tabela.

    Então podem copiar o ID da tabela e acessar o arquivo estilo filtro pedidos ponto html desce até o final dos códigos coloca o jogo da velha contra o v e abre.

    E fecha as chaves e dentro das chaves

    Comando position 2 pontos Absolut e ponto e vírgula tamanho da fonte propriedade fonte traço size dois pontos 12 pixels ponto e vírgula.

    Distância do Topo dois pontos 120 pixels ponto e vírgula distância da esquerda comando left 2 pontos 20 pixels ponto e vírgula e tem mais uma propriedade pessoal se vocês desejar não.

    Deixar intervalo entre as linhas das células vocês vão colocar o seguinte border colapse morder colapso e dois pontos comando colapse e ponto e vírgula se vocês colocar Este comando vai ficar.

    Apenas uma linha separando as células No meu caso eu vou deixar esta propriedade desativada prosseguindo eu quero definir também o seguinte quando o usuário passar o.

    Cursor sobre as linhas da tabela eu quero exibir o ícone de mãozinha para o cursor então novamente jogo da velha e de da tabela Tab TR para entrar nas linhas TD para.

    Entrar na células e abre e fecha as chaves e dentro das chaves comando cursor dois pontos Pointer e ponto e vírgula e eu quero também quando o usuário mover.

    O cursor sobre a tabela ao passar pela linha eu vou alterar a cor de preenchimento da linha em que o cursor está então novamente jogo da velha e de da tabela.

    Ter para entrar nas linhas dois pontos comando para entrar nas células abre e fecha Chaves e dentro das chaves comando né.

    Cor de preenchimento dois pontos eu vou colocar Orange que é laranjado e fecha a linha de código com ponto e vírgula salva as alterações e vamos testar para.

    Ver se vai aparecer a nossa tabela html no formulário por enquanto Montamos apenas a estrutura da tabela show de bola pessoal já está visível o cabeçalho da tabela por enquanto a nossa.

    Tabela não tem linhas porque as linhas vão ser inseridas Com base no filtro ou seja vamos filtrar os registros e carregar os registros filtrados para a tabela html.

    AVISO LEGAL: Toda a responsabilidade do conteúdo e autoria deste vídeo transcrito, é do produtor do canal. Clique no Link do Vídeo: https://www.youtube.com/watch?v=UuLjykWsURw

Postar um comentário

Post a Comment (0)

Postagem Anterior Próxima Postagem