Curso de Google Formulários - #13 Formulário Personalizado

Nesse tutorial vamos trabalhar com formulário html que será responsável pela entrada de dados do usuário. Vamos utilizar as classes do Bootstrap.

Formulário com Bootstrap

index.php

O arquivo index.php ficará responsável por abrigar o formulário html:

<div class="col-6">
    <form name="form1" id="form1" method="post" action="controllers/FormController.php">
        <input class="form-control" name="nome" id="nome" type="text" placeholder="Nome:" required>

        <div class="mt-4 mb-4">
            <div>Gênero:</div>
            <div class="custom-control custom-radio">
                <input type="radio" id="customRadio1" name="genero" class="custom-control-input" value="Masculino">
                <label class="custom-control-label" for="customRadio1">Masculino</label>
            </div>
            <div class="custom-control custom-radio">
                <input type="radio" id="customRadio2" name="genero" class="custom-control-input" value="Feminino">
                <label class="custom-control-label" for="customRadio2">Feminino</label>
            </div>
        </div>

        <div class="mt-4 mb-4">
            <div>Do que você gostou?</div>
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" id="customCheck1" name="preferencia[]" value="Funcionários">
                <label class="custom-control-label" for="customCheck1">Funcionários</label>
            </div>
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" id="customCheck2" name="preferencia[]" value="Limpeza">
                <label class="custom-control-label" for="customCheck2">Limpeza</label>
            </div>
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" id="customCheck3" name="preferencia[]" value="Localização">
                <label class="custom-control-label" for="customCheck3">Localização</label>
            </div>
        </div>

        <div class="mt-4 mb-4">
            <label for="exampleFormControlTextarea1">Comente sua hospedagem:</label>
            <textarea class="form-control" id="exampleFormControlTextarea1" name="comentario" rows="3"></textarea>
        </div>

        <input type="submit" value="Enviar" class="btn btn-dark">
    </div>
</form>
</div>

controllers/FormController.php

Vamos fazer um teste do recebimento de dados no backend:

<?php
var_dump($_POST);

Por hoje é só! Sucesso nos códigos e na vida!

Precisa de um professor particular? webdesignemfoco@gmail.com