Home
Button Mobile Webdesign em Foco
Newsletter Webdesign em Foco
Support Webdesign em Foco
Contribuition Webdesign em Foco
Doe para a Webdesign em Foco
Suporte da Webdesign em Foco
Fechar

Google Planilhas Avançado - #45 ClassLayout e Formulário

21/01/2020

Na aula de hoje trabalharemos com uma classe pra definir o layout do nosso sistema e o formulário de dados.

ClassLayout

Os elementos que se repetem em todas as páginas podem ser exibidos através de uma classe específica, para que não necessitemos repetir o mesmo código várias vezes. Para isso, dentro da pasta class, iremos criar o arquivo ClassLayout.php

<?php
namespace Classes;

class ClassLayout{

    #Header
    public static function getHeader()
    {
        $html="<!doctype html>\n";
        $html.="<html lang='pt-br'>\n";
        $html.="<head>\n";
        $html.="<meta charset='UTF-8'>\n";
        $html.="<meta name='viewport' content='width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0'>\n";
        $html.="<meta http-equiv='X-UA-Compatible' content='ie=edge'>\n";
        $html.="<title>API Google Planilhas</title>\n";
        $html.="<link rel='stylesheet' href='https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css' integrity='sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T' crossorigin='anonymous'>\n";
        $html.="</head>\n";
        $html.="<body>\n";
        return $html;
    }

    #Footer
    public static function getFooter()
    {
        $html="</body>\n";
        $html.="</html>\n";
        return $html;
    }

    #Form
    public static function getForm()
    {
        $html="<form name='form' id='form' method='post' action='../controllers/DataController.php'>\n";
        $html.="<input type='hidden' name='id' id='id' value=''>\n";
        $html.="<input type='hidden' name='action' id='action' value=''>\n";
        $html.="<input type='hidden' name='range' id='range' value=''>\n";
        $html.="<div class='form-group'>\n";
        $html.="<label for='name'>Nome:</label>\n";
        $html.="<input type='text' class='form-control' id='name' name='name' placeholder='Nome:'>\n";
        $html.="<small class='form-text text-muted'>Nunca compartilhe seus dados pessoais!</small>\n";
        $html.="</div>\n";
        $html.="<div class='form-group'>\n";
        $html.="<label for='age'>Idade:</label>\n";
        $html.="<input type='text' class='form-control' id='age' name='age' placeholder='Idade:'>\n";
        $html.="</div>\n";
        $html.="<div class='form-group'>\n";
        $html.="<label for='city'>Cidade:</label>\n";
        $html.="<input type='text' class='form-control' id='city' name='city' placeholder='Cidade:'>\n";
        $html.="</div>\n";
        $html.="<button type='submit' class='btn btn-primary'>Enviar</button>\n";
        $html.="</form>\n";
        return $html;
    }
}

Para implementar o head e o footer basta fazermos assim na nossa view:

<?php
include("../lib/vendor/autoload.php");
echo Classes\ClassLayout::getHeader();
?>

    CONTEÃ?DO

<?php echo \Classes\ClassLayout::getFooter(); ?>

Formulário de Dados

Para cadastro de dados, faremos um formulário html para inserção dos dados na planilha. Criaremos então o arquivo create.php dentro da pasta views.

<?php include("../lib/vendor/autoload.php");echo Classes\ClassLayout::getHeader(); ?>

<h1 class="text-center">Cadastro de Dados</h1><hr>
<div class="col-8 m-auto">
    <?php echo \Classes\ClassLayout::getForm(); ?>
</div>

<?php echo \Classes\ClassLayout::getFooter(); ?>

DataController

Dentro de controllers será criado o arquivo DataController.php

Por hoje é só! Sucesso nos codigos e na vida!

Receba as aulas da Webdesign em Foco em Seu Email
Suporte Webdesign em Foco

Posts Relacionados

Google Planilhas Avançado - #44 Lendo dados da Planilha via API II
Na vídeoaula de hoje aprimoraremos a exibição dos dados vindos do Google Planilhas para o usuário final, exibindo os registros através de uma tabela.
Saiba mais!
Google Planilhas Avançado - #46 Finalizando Formulário
Nessa vídeoaula terminaremos o formulário de integração com o Google Planilhas, passando um parâmetro que definirá se é um formulário de cadastro ou edição
Saiba mais!
Google Planilhas
Neste curso abordaremos a fundo as funcionalidades do Google Planilha. Adentraremos no Google App Script e na API do Google Sheet. Aproveite.
Saiba mais!