Páginas

▼

quinta-feira, 17 de setembro de 2020

DICAS 3105 -WEBDEV TUTORIAL 39 - 28-09-2020-09_00Hrs-SEG-Licao 3.3. UPLOAD - GERENCIANDO A IMAGEN DO PRODUTO - Parte L


https://youtu.be/KDNZp3Nrwgo


Bom Dia Boa Tarde Boa Noite

Esse Ao Vivo vai estrear as 09:00 do dia 28/09/2020-SEG

DICAS 3105 -WEBDEV TUTORIAL 39 - 28-09-2020-09_00Hrs-SEG-Licao 3.3. UPLOAD - GERENCIANDO A IMAGEN DO PRODUTO - Parte L
Lesson 3.3. Pages for addition and modification

ASSUNTOS

Gerenciando a imagem do produto
O upload consiste em copiar um arquivo do computador cliente para o servidor.
WEBDEV se propõe a gerenciar o upload do arquivo por meio de dois controles específicos:
Para criar o controle de upload:
Para configurar o controle de upload
Comandos usados
UploadCopyFile 
fsep
gsImagePath 
fLoadBuffer 



DICAS 3067 -WEBDEV TUTORIAL 1-Licao 1.1-14-09-2020 11hrs-DESCUBRA WEBDEV
DICAS 3068 -WEBDEV TUTORIAL 1-Licao 1.2-14-09-2020 15hrs-Web development and WEBDEV - PARTE A
DICAS 3069 -WEBDEV TUTORIAL 3-Licao 1.2-14-09-2020 16hrs-Web development and WEBDEV - PARTE B


===================================================

// receiving the files uploade from upd_upload server
// UploadCopyFile é usado para salvar no servidor o arquivo carregado pelo usuário. 
// No nosso caso, o arquivo é copiado para o diretório de dados (retornado por fDataDir ). 
// O nome do arquivo é mantido.
UploadCopyFile (MySelf, fDataDir (), UploadFileName (MySelf, False ))
// Em seguida, o caminho da imagem enviada é armazenado em uma variável global chamada gsImagePath .
// O fSep permite recuperar o separador que será usado no sistema operacional do servidor 
// ("\" para Windows, "/" para Linux). Portanto, seu site é independente do servidor onde está instalado!
gsSimagepath = fDataDir () + [ fSep ()] + UploadFileName (MySelf, False )

// a imagem carregada é exibida no controle IMG_Visual Image.
// the loaded image is displayed in the IMG_Visual Image control.
// l'image chargée est affichée dans le champ IMG_Visual Image.
// la imagen cargada se muestra en el control IMG_Visual Image.
IMG_Visual = gsSimagepath


===================================================

// clic on btn_validar (Server)
// No evento "Click (server)" do controle Button, escreva o código WLanguage para salvar os dados
// PageToFile é usado para inicializar os itens com os valores dos controles vinculados, para o registro atual.

PageToFile()
IF gsSimagepath<>"" THEN
// Neste caso, o item "Visual" do arquivo de dados do Produto é preenchido com o conteúdo da imagem binária.
// Este conteúdo é recuperado por fLoadBuffer 

Product.Visual=fLoadBuffer(gsSimagepath)

END
// HModify é usado para atualizar os dados do arquivo para o registro atual.
HModify(Product)

// PageDisplay é usado para exibir outra página. Em nosso caso, "PAGE_List_of_products" é exibido novamente.
PageDisplay(PAGE_LISTA_PRODUTOS)




===================================================

PlayList WebDev tutorial Amarildo Webdev
Playlist Windev Tutorial Amarildo Windev
Playlist windev Franca PcSoft
Amarildo
Windev
WxSolucoes
Matos Informatica
Repositorio Windev
Site forum Google 
Video sobre 3 Mil Videos Windev 
PlayList Pedrosao
Video sobre Alfaserver servidor 
Ultimo Video manipulacao arquivos





ErpMatos - TgsSistemas
skype:amarildo.matos.informatica
email: amarildo.matos@gmail.com
whats: 51984197742
Youtube: Amarildo Matos
http://www.amarildomatos.com.br
https://groups.google.com/forum/#!forum/amarildowindev

www.windev.com
https://www.pcsoft.fr/webinaires.htm?p=forumpcs
https://forum.pcsoft.fr/fr-FR/pcsoft.br.windev/page/1.awp
https://www.windev.com/windev/WD-Express.htm
https://www.windev.com/windevmobile/WM-Express.htm
http://windevdesenvolvimento.blogspot.com.br/2017/07/menu-blog.html



Gerenciando a imagem do produto

No arquivo de dados do produto, um item é usado para armazenar a imagem associada ao produto.
O controle Image já se encontra em nossa página, permitindo que vejamos a imagem, mas vamos dar ao usuário da Web a possibilidade de alterar a imagem associada ao produto.
Para isso, vamos permitir que o usuário da Web faça upload de um arquivo de imagem encontrado em seu computador e associe-o ao item encontrado no arquivo de dados. Estaremos usando um controle de upload.

Observação

O upload consiste em copiar um arquivo do computador cliente para o servidor.
Pelo contrário, o download consiste em copiar um arquivo do servidor para o computador cliente.

Observação

WEBDEV se propõe a gerenciar o upload do arquivo por meio de dois controles específicos:
  • um controle de upload usado para fazer upload de um único arquivo,
  • um controle de upload usado para fazer upload de vários arquivos.
Neste exemplo, o usuário fará o upload de um único arquivo por vez, portanto, usaremos o controle de upload de arquivo único.
  • Para criar o controle de upload:
    1. No painel "Criação", no grupo "Controles usuais", clique em "Botão". A lista de botões predefinidos é exibida.
    2. Selecione "Carregando arquivos".
    3. Clique na posição onde o controle deve ser criado na página (abaixo do controle Image, por exemplo).
      Criação do controle de upload

Observação

O controle de upload inclui:
  • uma célula contendo:
    • um controle estático,
    • um controle Looper usado para exibir as características dos arquivos a serem carregados.
  • um botão que permite ao usuário selecionar o arquivo para upload,
  • um botão que permite ao usuário enviar os arquivos para o servidor.
Agora vamos adaptar o código de controle para gerenciar o upload de arquivos em nosso site.
  • Para configurar o controle de upload:
    1. Exibe o código do controle do botão "ADICIONAR": selecione o controle e pressione F2.
    2. Diferentes eventos WLanguage estão associados ao controle Upload. Vamos modificar o evento "Recebendo os arquivos carregados" para copiar a imagem para o diretório de dados do site.
    3. Escreva o seguinte código no evento "Recebendo os arquivos enviados" (ignore os erros de compilação, iremos corrigi-los mais tarde):
      UploadCopyFile (MySelf, fDataDir (), UploadFileName (MySelf, False ))
      gsImagePath = fDataDir () + [ fSep ()] + UploadFileName (MySelf, False )
      IMG_ Visual = gsImagePath
    4. Vamos estudar este código:
      • UploadCopyFile é usado para salvar no servidor o arquivo carregado pelo usuário. No nosso caso, o arquivo é copiado para o diretório de dados (retornado por fDataDir ). O nome do arquivo é mantido.
      • Em seguida, o caminho da imagem enviada é armazenado em uma variável global chamada gsImagePath .

        Observação

        		Por que usar uma variável global?
        Uma variável global é necessária aqui porque o caminho da imagem será usado no código do botão "Validar", para salvar a nova imagem no arquivo de dados.
        Consulte os apêndices para obter mais detalhes sobre as condições de uso de variáveis ​​locais e globais.
      • O fSep permite recuperar o separador que será usado no sistema operacional do servidor ("\" para Windows, "/" para Linux). Portanto, seu site é independente do servidor onde está instalado!
      • Em seguida, a imagem carregada é exibida no controle IMG_Visual Image.
    5. Ao digitar e salvar o código, a variável gsImagePath é exibida em vermelho e um erro de compilação ocorre no painel de erro: "'gsImagePath' identificador desconhecido ou inacessível". Na verdade, essa variável global não foi declarada.
    6. Para declarar a variável global:
      • Vá para o evento "Declarações globais" da página (por exemplo, no editor de código, vá para o painel "Código" e selecione "Declarações globais" na caixa de combinação que lista todos os eventos).
        Eventos de um elemento
      • Digite o seguinte código após a declaração do procedimento:
        gsImagePath é string
    7. Salve as modificações clicando Salvar um elementoentre os botões de acesso rápido. Os erros de compilação desaparecem.
    8. Feche o editor de código.
Nossa imagem agora pode ser carregada no servidor. Tudo que você precisa fazer agora é salvar a imagem no banco de dados.
  • Para salvar a imagem no arquivo de dados do produto:
    1. Exiba o código do controle do botão "Validar":
      • Selecione o controle do botão "Validar".
      • Pressione F2.
    2. No evento "Click (server)", adicione o seguinte código APÓS a chamada para PageToFile :
      IF gsImagePath <> "" ENTÃO Produto . Visual = fLoadBuffer ( gsImagePath ) END


    3. Vamos dar uma olhada neste código WLanguage:
      • Este código verifica o conteúdo da variável global gsImagePath . Se esta variável não corresponder a uma string vazia, significa que a imagem foi enviada pelo usuário. Neste caso, o item "Visual" do arquivo de dados do Produto é preenchido com o conteúdo da imagem binária. Este conteúdo é recuperado por fLoadBuffer .
      • HModify (já encontrado no código) é usado para salvar as alterações no arquivo de dados.
    4. Salve as modificações ( Salvar um elementoou Ctrl + S).
    5. Feche a janela de código.



às Nenhum comentário:

DICAS 3104 -WEBDEV TUTORIAL 38 - 27-09-2020-11_00Hrs-DOM-Licao 3.3. CRIANDO CONTROLE BOTAO - VALIDAR - Parte J


https://youtu.be/5f3h7QrVMXs


Bom Dia Boa Tarde Boa Noite

Esse Ao Vivo vai estrear as 11:00 do dia 27/09/2020-DOM

DICAS 3104 -WEBDEV TUTORIAL 38 - 27-09-2020-11_00Hrs-DOM-Licao 3.3. CRIANDO CONTROLE BOTAO - VALIDAR - Parte J
Lesson 3.3. Pages for addition and modification

ASSUNTOS

CRIANDO BOTAO VALIDAR 
EXPLICANDO O QUE É BOTAO VALIDAR 
IR CODIGO DO BOTAO VALIDAR
VERIFICAR SE OS EDT FORAM PREENCHIDOS - LADO BROWSER - NAVEGADOR
PageToFile()
HModify(Product)
PageDisplay(PAGE_LISTA_PRODUTOS)
EXPLICANDO OS 3 COMANDOS ACIMA


DICAS 3067 -WEBDEV TUTORIAL 1-Licao 1.1-14-09-2020 11hrs-DESCUBRA WEBDEV
DICAS 3068 -WEBDEV TUTORIAL 1-Licao 1.2-14-09-2020 15hrs-Web development and WEBDEV - PARTE A
DICAS 3069 -WEBDEV TUTORIAL 3-Licao 1.2-14-09-2020 16hrs-Web development and WEBDEV - PARTE B


=======================================
// BTN_vALIDAR ( BROWSER - NAVEGADOR )
// No evento "Click (navegador)" escrever os códigos para verificar os dados inseridos:

// Para cada controle de edição encontrado em nossa página, uma verificação é realizada para descobrir se um valor foi digitado.
// O operador '~ =' é usado para verificar a igualdade, excluindo o caso e a pontuação.
// se nenhum valor for digitado, uma mensagem de erro solicitará que o usuário da Web execute uma entrada ( Erro ). 
// A execução do código é interrompida // ReturnToCapture - volto a digitar o edt

// Fizemos o mesmo para Catpion,Description, e o Price que é valor a condicao foi = 0

IF EDT_Reference~="" THEN
Error("Referencia nao preenchida")
ReturnToCapture(EDT_Reference)
END
IF EDT_Caption~="" THEN
Error("Caption nao preenchida")
ReturnToCapture(EDT_Caption)
END
IF EDT_Description~="" THEN
Error("Descricao nao preenchida")
ReturnToCapture(EDT_Description)
END
IF EDT_PriceBT=0 THEN
Error("Preco nao preenchida")
ReturnToCapture(EDT_PriceBT)
END

// In the event "Click (browser)" write the codes to check the data entered:
// In the event "Click (browser)" write the codes to check the data entered:
// En el caso de "Click (navegador)" escriba los códigos para verificar los datos ingresados:

// For each edit control found on our page, a check is performed to find out if a value was entered.
// The '~ =' operator is used to check for equality, excluding the case and punctuation.
// if no value is entered, an error message will prompt the web user
// perform an entry (Error). Code execution is interrupted // ReturnToCapture - retype edt
// Pour chaque champ d'édition trouvé sur notre page, une vérification est effectuée pour savoir si une valeur a été saisie.
// L'opérateur '~ =' est utilisé pour vérifier l'égalité, en excluant la casse et la ponctuation.
// si aucune valeur n'est saisie, un message d'erreur invitera l'internaute
// effectue une saisie (Erreur). L'exécution du code est interrompue // ReturnToCapture - retapez edt.
// Para cada control de edición que se encuentra en nuestra página, se realiza una verificación para averiguar si se ingresó un valor.
// El operador '~ =' se usa para verificar la igualdad, excluyendo el caso y la puntuación.
// si no se ingresa ningún valor, un mensaje de error le preguntará al usuario web
// realiza una entrada (Error). Se interrumpe la ejecución del código // ReturnToCapture - reescribe edt.

// We did the same for Catpion, Description, and the Price that is value the condition was = 0     
// Nous avons fait la même chose pour Catpion, Description et le prix qui est la valeur de la condition était = 0
// Nous avons fait la même chose pour Catpion, Description et le prix qui est la valeur de la condition était = 0
===============================================

// clic on btn_validar (Server)

// No evento "Click (server)" do controle Button, escreva o código WLanguage para salvar os dados
// In the "Click (server)" event of the Button control, write the WLanguage code to save the data
// Dans l'événement "Click (serveur)" du champ Button, écrivez le code WLangage pour enregistrer les données
// En el evento "Click (servidor)" del control Button, escriba el código WLanguage para guardar los datos


// PageToFile é usado para inicializar os itens com os valores dos controles vinculados, para o registro atual.
// PageToFile is used to initialize items with the values of the linked controls, for the current record.
// PageToFile est utilisé pour initialiser les éléments avec les valeurs des contrôles liés, pour l'enregistrement courant.
// PageToFile est utilisé pour initialiser les éléments avec les valeurs des contrôles liés, pour l'enregistrement courant.

PageToFile()

// HModify é usado para atualizar os dados do arquivo para o registro atual.
// HModify is used to update the file data for the current record.
// HModify est utilisé pour mettre à jour les données de fichier pour l'enregistrement en cours.
// HModify se usa para actualizar los datos del archivo para el registro actual.

HModify(Product)

// PageDisplay é usado para exibir outra página. Em nosso caso, "PAGE_List_of_products" é exibido novamente.
// PageDisplay is used to display another page. In our case, "PAGE_List_of_products" is redisplayed.
// PageDisplay est utilisé pour afficher une autre page. Dans notre cas, "PAGE_List_of_products" est réaffiche.
// PageDisplay est utilisé pour afficher une autre page. Dans notre cas, "PAGE_List_of_products" est réaffiche....

PageDisplay(PAGE_LISTA_PRODUTOS)


// PageToFile()

// Esta função é equivalente às seguintes linhas de código:
// This function is equivalent to the following lines of code:
// Cette fonction équivaut aux lignes de code suivantes:
// Esta función es equivalente a las siguientes líneas de código:

//Product.Reference = EDT_Reference
//Product.Caption = EDT_Caption
//Product.Description = EDT_Description

===========================================





PlayList WebDev tutorial Amarildo Webdev
Playlist Windev Tutorial Amarildo Windev
Playlist windev Franca PcSoft
Amarildo
Windev
WxSolucoes
Matos Informatica
Repositorio Windev
Site forum Google 
Video sobre 3 Mil Videos Windev 
PlayList Pedrosao
Video sobre Alfaserver servidor 
Ultimo Video manipulacao arquivos





ErpMatos - TgsSistemas
skype:amarildo.matos.informatica
email: amarildo.matos@gmail.com
whats: 51984197742
Youtube: Amarildo Matos
http://www.amarildomatos.com.br
https://groups.google.com/forum/#!forum/amarildowindev

www.windev.com
https://www.pcsoft.fr/webinaires.htm?p=forumpcs
https://forum.pcsoft.fr/fr-FR/pcsoft.br.windev/page/1.awp
https://www.windev.com/windev/WD-Express.htm
https://www.windev.com/windevmobile/WM-Express.htm
http://windevdesenvolvimento.blogspot.com.br/2017/07/menu-blog.html



Botão de validação
  • Para criar o controle do botão "Validar":
    1. No painel "Criação", no grupo "Controles usuais", clique em "Botão".
    2. Em seguida, clique à esquerda do botão "Cancelar" para criar o novo controle.
    3. Modifique a legenda do controle: a nova legenda é "Validar".
      Formulário de produto com controles de botão
      O controle do botão "Validar" será usado para:
      • verificar os dados digitados: esta verificação consiste em verificar se os diferentes controles da página foram preenchidos pelo usuário. Esta verificação não requer nenhum acesso ao servidor e pode ser realizada no código do navegador.
      • salve os dados digitados no arquivo de dados do produto. Ele é salvo no código do servidor. Os dados são enviados ao servidor e depois salvos no arquivo de dados.
  • Escreva o código associado ao botão "Validar":
    1. Selecione o controle do botão "Validar" e pressione F2. Os eventos associados ao controle de botão são exibidos.
    2. No evento "Click (navegador)" do controle Button, escreva o seguinte código para verificar os dados inseridos:
      IF EDT_Reference ~= "" THEN
      Error("A reference must be typed.")
      ReturnToCapture(EDT_Reference)
      END
      IF EDT_Caption ~= "" THEN
      Error("A caption must be typed.")
      ReturnToCapture(EDT_Caption)
      END
      IF EDT_Description ~= "" THEN
      Error("A description must be typed.")
      ReturnToCapture(EDT_Description)
      END
      IF EDT_PriceBT = 0 THEN
      Error("A price must be typed.")
      ReturnToCapture(EDT_PriceBT)
      END
    3. Vamos dar uma olhada neste código WLanguage:
      • Para cada controle de edição encontrado em nossa página, uma verificação é realizada para descobrir se um valor foi digitado.
      • O operador '~ =' é usado para verificar a igualdade, excluindo o caso e a pontuação.
      • Se nenhum valor for digitado, uma mensagem de erro solicitará que o usuário da Web execute uma entrada ( Erro ). A execução do código é interrompida e a entrada é forçada no controle de edição relevante por ReturnToCapture .
    4. No evento "Click (server)" do controle Button, escreva o código WLanguage para salvar os dados:
      PageToFile ()
      HModify ( Product )
      PageDisplay ( PAGE_ List_of_products )
    5. Vamos dar uma olhada neste código WLanguage:
      • PageToFile é usado para inicializar os itens com os valores dos controles vinculados, para o registro atual. Esta função é equivalente às seguintes linhas de código:
        Product.Reference = EDT_Reference
        Product.Caption = EDT_Caption
        Product.Description = EDT_Description
        ...



        Nossa página usa menos de 10 controles e o benefício já está lá; pense nas páginas que contêm muito mais controles: uma única linha de código executa todas as atribuições!
      • HModify é usado para atualizar os dados do arquivo para o registro atual.
      • PageDisplay é usado para exibir outra página. Em nosso caso, "PAGE_List_of_products" é exibido novamente.
    6. Salve as modificações ( Salvar um elementoou Ctrl + S).
    7. Feche a janela de código.



às Nenhum comentário: