1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

  2. Anuncie Aqui ! Entre em contato fdantas@4each.com.br
Cookies Anuncie aqui Patrocinador Anuncios

008 - Usando form´s

Discussão em 'Ambiente Web - Webspeed e/ou StarWeb FrameWork' iniciado por Agnaldo, Janeiro 5, 2014.

  1. Agnaldo

    Agnaldo Membro Ativo

    Tempo estimado de leitura: menos de 10 minutos​


    Link´s é uma forma simples de, a partir de uma página/programa, acessarmos outro.
    Eles também permitem que dados sejam passados entre as páginas.
    Poderíamos usar essa forma de passagem de parâmetros dentro de uma mesma página, fazendo com que ela tivesse um link para ela mesma, mas passando parâmetros...

    Uma forma mais eficiente de fazer isso, dependendo da situação, é o uso de formalários (form).

    Um form nada mais é que uma estrutura do HTML onde campos e botões podem ser colocados e, a partir de uma determinada ação, enviar informações para o servidor.

    Vamos imaginar uma tela onde possamos informar o código de um cliente e, apertando um botão, essa informação é enviada para o servidor, para o nosso programa, de maneira que, a partir desse código informado, possamos trazer os demais dados do cliente.

    Vamos montar o esqueleto inicial do nosso código.
    Algo assim.
    PHP:
    { src/web/method/wrap-cgi.i }
    output-content-type("text/html").

    {&    out} '<html>' SKIP
               '<head>' SKIP
               '<title>Consulta cliente</title>' SKIP
               '</head>' SKIP
               '<body>' SKIP(1).


    {&    out} '</body>' SKIP
               '</html>' SKIP(1).
    Nós vamos precisar de uma variável, código, que irá receber o código do cliente informado.
    Vamos também já aproveitar e montar uma div que centralize a tela na horizontal.
    Então, teriamos:
    PHP:
    DEFINE VARIABLE codigo AS CHARACTER.

    {     src/web/method/wrap-cgi.i }
    output-content-type("text/html").

    {&    out} '<html>' SKIP
               '<head>' SKIP
               '<title>Consulta cliente</title>' SKIP
               '</head>' SKIP
               '<body>' SKIP(1).

    {&    out} '<div align="center">' SKIP.

    {&    out} '</div>' SKIP.

    {&    out} '</body>' SKIP
               '</html>' SKIP(1).
    Embora o campo código do cliente na tabela Customer, campo Cust-Num, seja do tipo integer, precismos nos lembrar que "essa" variável código irá receber o valor vindo do browser. E o browser não possui tipagem de dados. Sendo assim, o que o browser mandar será uma string (caracter).

    Podemos agora, então, montar nossa "tela" propriamente dita.
    Iremos montar uma a tabela (table). Ela servirá para deixar nosso conteúdo alinhado, uma vez que podemos alinhar as células da tabela.
    E dentro dessa tabela, colocaremos um elemento "input type text" do html.
    Tudo isso estará dentro de um form.
    Já vamos aproveitar também e fazer um GET-VALUE (ler o código) logo no começo.

    Algo assim:
    PHP:
    DEFINE VARIABLE codigo AS CHARACTER.

    {     src/web/method/wrap-cgi.i }
    output-content-type("text/html").

    {&    out} '<html>' SKIP
               '<head>' SKIP
               '<title>Consulta cliente</title>' SKIP
               '</head>' SKIP
               '<body>' SKIP(1).

    {&    out} '<div align="center">' SKIP.

    /* *** Lê o valor da interface *** */
    ASSIGN codigo = GET-VALUE("codigo").

    {&    out} '<form method="post" name="form" action="consulta">' SKIP
               '   <table border="0" cellspacing="2" cellpadding="1">' SKIP
               '      <tr>' SKIP
               '         <td align="right">Cliente a pequisar:</td>' SKIP
               '         <td>' SKIP
               '            <input type="text" name="codigo" value="' codigo '" size="5" maxlength="5">' SKIP
               '            <input type="submit" name="btn" value="Pesquisar">' SKIP
               '         </td>' SKIP
               '      </tr>' SKIP
               '   </table>' SKIP
               '</form>' SKIP.

    {&    out} '</div>' SKIP.

    {&    out} '</body>' SKIP
               '</html>' SKIP(1).
    Notem também que na linha do "input type" temos:
    Código:
    '            <input type="text" name="codigo" value="' codigo '" size="5" maxlength="5">' SKIP
    Vejam que na propriedade "value" estamos mostrando (dando {&out}) do conteúdo da variável código.
    Por isso colocamos o GET-VALUE logo no começo.

    Teremos como resultado uma tela como essa ...

    [​IMG]


    A primeira vez que entramos no programa/página, ou seja, quando chamamos pela URL, essa tela deve ser mostrada.
    A partir daí começamos a interagir com a página.
    Ou seja, pose digitar o código de um cliente e pressionar o botão "Pesquisar".
    O form será enviado para o servidor (nosso programa) e fará algo.

    Temo então duas situações.
    1) A primeira vez que chamamos a página, normalmente pela URL, queremos apenas que a tela seja desenhada.
    2) Uma segunda chamada, dessa vez interagindo com a página, através do botão de Pesquisar, queremos que a consulta (FIND) pelo código seja feita.

    Podemos notar no nosso programa, na linha que desenha o form, o seguinte:
    Código:
    {&out} '<form method="post" name="form" action="consulta">' SKIP
    action aponta para o programa em uso, que chamamos de consulta (consulta.p).
    method é o método de envio usado. Dois são os mais comuns, GET e POST. Notem que deixamos o mesmo como POST.
    Aqui usamos o seguinte "atalho", deixando sempre em post essa propriedade:
    Toda vez que uma página á chamada pela URL, provavelmente é a primeira vez que ela é chamada. Dizemos que estamos em modo GET. A partir daí, quando interagimos com a página, dizemos que estamos usando POST.

    Dentro da include wrap-cgi existe uma variável que trata esse valor, GET/POST, para nós.
    Ela se chama REQUEST_METHOD.

    Então teríamos o seguinte...
    SE REQUEST_METHOD = "POST" significa que estamos interagindo com uma página que já havia sido carregada. Caso contrário, é a primeira vez que o programa esta rodando (provávelmete foi chamado pela URL).


    Continua...
    Última edição: Janeiro 6, 2014
    Agnaldo, Janeiro 5, 2014
    #1
    brazjuniorgyn e Mokwa curtiram isso.
  2. Agnaldo

    Agnaldo Membro Ativo

    O nosso programa deverá fazer então:
    1. Mostrar a tela solicitando o código
    2. SE for modo POST (significa que foi enviado um código) fazer o FIND do cliente.
    Resumidamente, algo assim:
    PHP:
    DEFINE VARIABLE codigo AS CHARACTER.

    {     src/web/method/wrap-cgi.i }
    output-content-type("text/html").

    {&    out} '<html>' SKIP
               '<head>' SKIP
               '<title>Consulta cliente</title>' SKIP
               '</head>' SKIP
               '<body>' SKIP(1).

    {&    out} '<div align="center">' SKIP.

    /* *** Lê o valor da interface *** */
    ASSIGN codigo = GET-VALUE("codigo").

    {&    out} '<form method="post" name="form" action="consulta">' SKIP
               '   <table border="0" cellspacing="2" cellpadding="1">' SKIP
               '      <tr>' SKIP
               '         <td align="right">Cliente a pequisar:</td>' SKIP
               '         <td>' SKIP
               '            <input type="text" name="codigo" value="' codigo '" size="5" maxlength="5">' SKIP
               '            <input type="submit" name="btn" value="Pesquisar">' SKIP
               '         </td>' SKIP
               '      </tr>' SKIP
               '   </table>' SKIP
               '</form>' SKIP.

    IF     REQUEST_METHOD = "POST"
           THEN
               DO:
                  /* *** Busca o registro do cliente o mostra na interface *** */
                  FIND FIRST Customer WHERE Customer.Cust-Num = INTEGER(codigo) NO-LOCK NO-ERROR.
              .
              .
              .
               END.

    {&    out} '</div>' SKIP.

    {&    out} '</body>' SKIP
               '</html>' SKIP(1).
    Teríamos então uma tela de entrada:

    [​IMG]

    Digitando um código e pressionando o botão "Pesquisar", faríamos um "post", um enviar os dados.
    Nosso programa:
    Faria o GET-VALUE do código
    Desenharia a tela do form novamente (mostrando o valor do código)
    Veria que o REQUEST_METHOD vale POST, faria o FIND e o "display" dos dados.
    Teríamos algo assim como resposta.

    [​IMG]

    Basta agora apenas fazermos a parte de "display" dos dados.
    PHP:
    DEFINE VARIABLE codigo AS CHARACTER.

    {     src/web/method/wrap-cgi.i }
    output-content-type("text/html").

    {&    out} '<html>' SKIP
               '<head>' SKIP
               '<title>Consulta cliente</title>' SKIP
               '</head>' SKIP
               '<body>' SKIP(1).

    {&    out} '<div align="center">' SKIP.

    /* *** Lê o valor da interface *** */
    ASSIGN codigo = GET-VALUE("codigo").

    {&    out} '<form method="post" name="form" action="consulta">' SKIP
               '   <table border="0" cellspacing="2" cellpadding="1">' SKIP
               '      <tr>' SKIP
               '         <td align="right">Cliente a pequisar:</td>' SKIP
               '         <td>' SKIP
               '            <input type="text" name="codigo" value="' codigo '" size="5" maxlength="5">' SKIP
               '            <input type="submit" name="btn" value="Pesquisar">' SKIP
               '         </td>' SKIP
               '      </tr>' SKIP
               '   </table>' SKIP
               '</form>' SKIP.

    IF     REQUEST_METHOD = "POST"
           THEN
               DO:
                  /* *** Busca o registro do cliente o mostra na interface *** */
                  FIND FIRST Customer WHERE Customer.Cust-Num = INTEGER(codigo) NO-LOCK NO-ERROR.
              IF     NOT AVAILABLE Customer
                 THEN
                         {&out} '<b>Este código de cliente não existe.</b>' SKIP.
                 ELSE
                     DO:
                        {&    out} '<table border="0" cellspacing="1" cellpadding="1" width="100%">' SKIP
                                   '   <tr>' SKIP
                                   '      <td colspan="4" align="center" bgcolor="#FFFFCC"><b>Registro do cliente ' Customer.Cust-Num '</b></td>' SKIP
                                   '   <tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Nome:</b></td>' SKIP
                                   '      <td colspan="3">' Customer.Name '</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Endereço:</b></td>' SKIP
                                   '      <td colspan="3">' Customer.Address (IF Customer.Address2 <> '' THEN (', ' + Customer.Address2) ELSE '') '</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Cidade:</b></td>' SKIP
                                   '      <td>' Customer.City '</td>' SKIP
                                   '      <td align="right"><b>Estado:</b></td>' SKIP
                                   '      <td>' Customer.State '</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Código postal:</b></td>' SKIP
                                   '      <td>' Customer.Postal-Code '</td>' SKIP
                                   '      <td align="right"><b>Telefone:</b></td>' SKIP
                                   '      <td>' Customer.Phone '</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Contato:</b></td>' SKIP
                                   '      <td colspan="3">' Customer.Contact '</td>' SKIP
                                   '   </tr>' SKIP.

                            FIND FIRST SalesRep OF Customer NO-LOCK NO-ERROR.
                        IF     AVAILABLE SalesRep
                           THEN
                                   {&out} '   <tr>' SKIP
                                          '      <td align="right"><b>Representante:</b></td>' SKIP
                                          '      <td colspan="3">' Customer.Sales-Rep ' - ' SalesRep.Rep-Name '</td>' SKIP
                                          '   </tr>' SKIP.
                           ELSE
                               {&    out} '   <tr>' SKIP
                                          '      <td align="right"><b>Representante:</b></td>' SKIP
                                          '      <td colspan="3">' Customer.Sales-Rep '</td>' SKIP
                                          '   </tr>' SKIP.

                        {&    out} '   <tr>' SKIP
                                   '      <td align="right"><b>Crédito:</b></td>' SKIP
                                   '      <td>' Customer.Credit-Limit FORMAT "->>>,>>>,>>9.99" '</td>' SKIP
                                   '      <td align="right"><b>Balanço:</b></td>' SKIP
                                   '      <td>' Customer.Balance FORMAT "->>>,>>>,>>9.99" '</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Termos:</b></td>' SKIP
                                   '      <td>' Customer.terms '</td>' SKIP
                                   '      <td align="right"><b>Desconto:</b></td>' SKIP
                                   '      <td>' Customer.Discount FORMAT "->>9.99" '%</td>' SKIP
                                   '   </tr>' SKIP
                                   '   <tr>' SKIP
                                   '      <td align="right"><b>Observações:</b></td>' SKIP
                                   '      <td colspan="3">' Customer.Comments '</td>' SKIP
                                   '   </tr>' SKIP
                                   '</table>' SKIP.
                         END.
               END.

    {&    out} '</div>' SKIP.

    {&    out} '</body>' SKIP
               '</html>' SKIP(1).
    Curtiu?
    Até o próximo post​
    Última edição: Janeiro 21, 2014
    Agnaldo, Janeiro 5, 2014
    #2
    liliane e brazjuniorgyn curtiram isso.
  3. Agnaldo

    Agnaldo Membro Ativo

    .
    Agnaldo, Janeiro 16, 2015
    #3

Compartilhe esta Página