Várias caixas de seleção PHP

Resumo : neste tutorial você aprenderá como lidar com um formulário com múltiplas caixas de seleção em PHP.

Como lidar com múltiplas caixas de seleção em um formulário

Um formulário pode conter várias caixas de seleção com o mesmo nome. Ao enviar o formulário, você receberá vários valores no servidor sob um nome.

Para obter todos os valores das caixas de seleção marcadas, você precisa adicionar colchetes ( []) após o nome das caixas de seleção.

Quando o PHP vê os colchetes ( []) no nome do campo, ele criará um array associativo de valores onde a chave é o nome da caixa de seleção e os valores são os valores selecionados.

O exemplo a seguir mostra um formulário que consiste em três caixas de seleção com o mesmo nome ( colors[]) com valores diferentes "red", "green"e "blue".

<form action="index.php" method="post">
	<input type="checkbox" name="colors[]" value="red" id="color_red" />
	<label for="color_red">Red</label>

	<input type="checkbox" name="colors[]" value="green" id="color_green" />
	<label for="color_red">Green</label>

	<input type="checkbox" name="colors[]" value="blue" id="color_blue" />
	<label for="color_red">Blue</label>
        <input type="submit" value="Submit">
</form>Linguagem de código:  HTML, XML  ( xml )

Quando você marca três caixas de seleção e envia o formulário, $_POST['colors']conterá uma matriz de três valores selecionados:

array(3) 
{ 
    [0]=> string(3) "red" 
    [1]=> string(5) "green" 
    [2]=> string(4) "blue" 
}
Linguagem de código:  texto simples  ( texto simples )

Se você não marcar nenhuma caixa de seleção e enviar o formulário, o $_POSTarray não terá a colorschave. E você pode usar a isset()função para verificar se $_POST['colors']está definido:

isset($_POST['colors'])Linguagem de código:  PHP  ( php )

Alternativamente, você pode usar a filter_has_var()função:

filter_has_var(INPUT_POST, 'colors')Linguagem de código:  PHP  ( php )

Exemplo de múltiplas caixas de seleção em PHP

Criaremos um aplicativo simples que permitirá aos usuários solicitar coberturas de pizza .

Exemplo de múltiplas caixas de seleção em PHP

Primeiro, crie a seguinte estrutura de arquivos e diretórios:

.
├── css
│   └── style.css
├── img
│   └── pizza.svg
├── inc
│   ├── .htaccess
│   ├── footer.php
│   ├── functions.php
│   ├── get.php
│   ├── header.php
│   └── post.php
└── index.phpLinguagem de código:  texto simples  ( texto simples )
Arquivo Diretório Descrição
index.php . Contém a lógica principal que carrega get.php ou post.php dependendo do método de solicitação HTTP
obter.php Inc. Contém o código para mostrar um formulário com uma caixa de seleção quando a solicitação HTTP for GET.
post.php Inc. Contém o código para lidar com a solicitação POST
cabeçalho.php Inc. Contém o código do cabeçalho
rodapé.php Inc. Contém o código do rodapé
funções.php Inc. Contém as funções comuns
.htaccess Inc. Impedir o acesso direto aos arquivos no diretório inc
estilo.css css Contém o código CSS
pizza.svg imagem A imagem da pizza que aparece no formulário

Em segundo lugar, adicione o seguinte código ao header.php:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/style.css">
    <title>PHP Multiple Checkboxes - Pizza Toppings</title>
</head>

<body class="center">
    <main>
        <p><img src="img/pizza.svg" height="72" width="72" title="Pizza Toppings"></p>Linguagem de código:  HTML, XML  ( xml )

Observe que a página usa a fonte Nanum Gothic Coding. Os header.phplinks para o arquivo style.css. No início do corpo, mostra a pizza.svgimagem.

Terceiro, adicione o seguinte código ao footer.php:

</main>
</body>
</html>Linguagem de código:  HTML, XML  ( xml )

O footer.phparquivo contém as tags de fechamento correspondentes às tags de abertura do header.phparquivo.

Quarto, defina uma função verificada no functions.phparquivo:

<?php

function checked($needle, $haystack)
{
	if ($haystack) {
		return in_array($needle, $haystack) ? 'checked' : '';
	}

	return '';
}
Linguagem de código:  PHP  ( php )

A checked()função retorna a string 'checked'se $needexistir no array $haystackou uma string vazia caso contrário.

Usaremos esta checked()função para preencher novamente as caixas de seleção selecionadas no formulário.

Quinto, adicione o seguinte código ao index.php:

<?php

session_start();

require 'inc/header.php';

require 'inc/functions.php';

$pizza_toppings = [
	'pepperoni' => 0.5,
	'mushrooms' => 1,
	'onions' => 1.5,
	'sausage' => 2.5,
	'bacon' => 1.0,
];

$request_method = $_SERVER['REQUEST_METHOD'];

if ($request_method === 'GET') {
	require 'inc/get.php';
} elseif ($request_method === 'POST') {
	require 'inc/post.php';
}

require 'inc/footer.php';
Linguagem de código:  PHP  ( php )

Como funciona o index.php.

O index.php chama a session_start()função para iniciar (ou retomar) uma sessão. Ele carrega o código de header.php, functions.php e footer.php.

A $pizza_toppingsmatriz armazena as coberturas e preços da pizza. Em uma aplicação real, você pode obtê-lo de um banco de dados ou de uma API.

Se o método HTTP for GET, o index.php carrega o formulário do arquivo get.php. Caso o método HTTP seja POST, ele carrega o código do arquivo post.php.

Sexto, crie um formulário no get.phparquivo:

<form action="<?php echo htmlspecialchars($_SERVER['PHP_SELF']) ?>" method="post">

    <h1>Please select your pizza toppings:</h1>
    <ul>
        <?php foreach ($pizza_toppings as $topping => $price) : ?>
            <li>
                <div>
                    <input type="checkbox" name="pizza_toppings[]" value="<?php echo $topping ?>" id="pizza_topping_<?php echo $topping ?>" <?php echo checked($topping, $_SESSION['selected_toppings'] ?? []) ?> />
                    <label for="pizza_topping_<?php echo $topping ?>"><?php echo ucfirst($topping) ?></label>
                </div>
                <span><?php echo '$' . $price ?></span>
            </li>
        <?php endforeach ?>
    </ul>

    <button type="submit">Order Now</button>
</form>Linguagem de código:  JavaScript  ( javascript )

O arquivo get.php usa o $pizza_toppingsarray para gerar caixas de seleção dinamicamente. A checked()função marca a caixa de seleção se o valor existe na $_SESSION['selected_toppings']variável.

Quando a página é carregada pela primeira vez, o campo $_SESSION['selected_toppings']está sempre vazio. Posteriormente, adicionaremos os valores selecionados no post.php.

Por fim, coloque o código para lidar com o envio do formulário no post.phparquivo:

<?php

// sanitize the inputs
$selected_toppings = filter_input(
    INPUT_POST,
    'pizza_toppings',
    FILTER_SANITIZE_STRING,
    FILTER_REQUIRE_ARRAY
) ?? [];

// select the topping names
$toppings = array_keys($pizza_toppings);

$_SESSION['selected_toppings'] = []; // for storing selected toppings
$total = 0; // for storing total

// check data against the original values
if ($selected_toppings) {
    foreach ($selected_toppings as $topping) {
        if (in_array($topping, $toppings)) {
            $_SESSION['selected_toppings'][] = $topping;
            $total += $pizza_toppings[$topping];
        }
    }
} ?>
<?php if ($_SESSION['selected_toppings']) : ?>
    <h1>Order Summary</h1>
    <ul>
        <?php foreach ($_SESSION['selected_toppings'] as $topping) : ?>
            <li>
                <span><?php echo ucfirst($topping) ?></span>
                <span><?php echo '$' . $pizza_toppings[$topping] ?></span>
            </li>
        <?php endforeach ?>

        <li class="total"><span>Total</span><span><?php echo '$' . $total ?></span></li>
    </ul>
<?php else : ?>
    <p>You didn't select any pizza toppings.</p>
<?php endif ?>
<menu>
    <a class="btn" href="<?php htmlentities($_SERVER['PHP_SELF']) ?>" title="Back to the form">Change Toppings</a>
</menu>Linguagem de código:  HTML, XML  ( xml )

O post.phparquivo limpa a entrada do formulário usando a filter_input()função:

// sanitize the inputs
$selected_toppings = filter_input(
	INPUT_POST,
	'pizza_toppings',
	FILTER_SANITIZE_STRING,
	FILTER_REQUIRE_ARRAY
) ?? [];Linguagem de código:  PHP  ( php )

Ele compara as coberturas de pizza selecionadas com os valores originais na $pizza_toppingsmatriz e adiciona os valores selecionados à $_SESSION['selected_toppings']variável. Além disso, calcula o preço total com base nas coberturas de pizza selecionadas.

$toppings = array_keys($pizza_toppings);

$_SESSION['selected_toppings'] = []; // for storing selected toppings
$total = 0; // for storing total

// check data against the original values
if ($selected_toppings) {
	foreach ($selected_toppings as $topping) {
		if (in_array($topping, $toppings)) {
			$_SESSION['selected_toppings'][] = $topping;
			$total += $pizza_toppings[$topping];
		}
	}
}Linguagem de código:  PHP  ( php )

A parte de marcação mostra o resumo do pedido se uma ou mais coberturas de pizza forem selecionadas.

Resumo

  • Adicione colchetes ( []) no final do nome da caixa de seleção quando um formulário tiver várias caixas de seleção com o mesmo nome.
  • O PHP cria um array associativo para valores armazenados das caixas de seleção selecionadas se as caixas de seleção tiverem o mesmo nome que termina com [].
Caixa de seleção PHP
Anterior
Caixa de seleção PHP

Próximo
Botão de opção PHP

Botão de opção PHP

Deixe um comentário

O seu endereço de email não será publicado. Campos obrigatórios marcados com *