How I can remove and print the textbox value associated with a php checkbox

Asked

Viewed 42 times

0

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Form</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
    <link href="style.css" rel="stylesheet" type="text/css">
</head>

<body>
    <div class="row">
        <div class="col-md-6">
            <header class = "logo">
                <img src="logoMaieutica-01.png" class="rounded float-left" alt="...">
                <div class="p-3 mb-2 bg-primary text-white">
                    <h1><center>Checklist - Materiais de Comunicação</center></h1>
                </div>
            </header>
        </div>
    </div>
    <form method="post" action="process.php">
        <div class="form-group">
            <label for="desscription">Descrição</label>
            <input type="text" name="eventDescription" class="form-control" placeholder="Nome completo do Evento">
        </div>
        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="date">Data do Pedido</label>
                <input type="date" name="askDate" class="form-control" placeholder="date">
            </div>
            <div class="form-group col-md-6">
                <label for="dataDoEvento">Data do Evento</label>  
                <input type="date" name="eventDate" class="form-control" placeholder="date2">
            </div>
        </div>
        <div class="form-row">
            <div class="form-group col-md-6">
                <label for="service">Serviço/Centro/Gabinete/Departamento</label>  
                <input type="text" name="gabinete" class="form-control" placeholder="Serviço/Centro/Gabinete/Departamento">
            </div>
            <div class="form-group col-md-6">
                <label for="ask">Pedido por</label>  
                <input type="text" name="asked" class="form-control" placeholder="Pedido por">
            </div>
        </div>
        <small class="form-text text-muted">Preencha devidamente os campos indicados.</small>
        <div class="p-3 mb-2 bg-warning text-white">
            <p>Design/Impressão</p>
        </div>
        <div class ="form-row">
            <div class="form-group col-md-4">
                <div class="p-3 mb-2 bg-secondary text-white">
                    <p>Tamanho do Cartaz</p>
                </div>
                <div class="custom-control custom-checkbox col-md-5">
                    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A0" id="customCheck1">
                    <label class="custom-control-label" for="customCheck1">Cartaz A0</label>
                    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
                </div>
                <div class="custom-control custom-checkbox col-md-5">
                    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A1" id="customCheck2">
                    <label class="custom-control-label" for="customCheck2">Cartaz A1</label>
                    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
                </div>
                <div class="custom-control custom-checkbox col-md-5">
                    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A2" id="customCheck3">
                    <label class="custom-control-label" for="customCheck3">Cartaz A2</label>
                    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
                </div>
                <div class="custom-control custom-checkbox col-md-5">
                    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A3" id="customCheck4">
                    <label class="custom-control-label" for="customCheck4">Cartaz A3</label>
                    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
                </div>
                <div class="custom-control custom-checkbox col-md-5">
                    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A4" id="customCheck5">
                    <label class="custom-control-label" for="customCheck5">Cartaz A4</label>
                    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
                </div>
            </div>

        <div class="form-group col-md-4">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Tipo de Programa</p>
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="Fa4" id="customCheck6">
                <label class="custom-control-label" for="customCheck6">Formato A4</label>
                <input type="text" name="fa4quant" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="Fa5" id="customCheck7">
                <label class="custom-control-label" for="customCheck7">Formato A5</label>
                <input type="text" name="fa5quant" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="BS" id="customCheck8">
                <label class="custom-control-label" for="customCheck8">Booklet Simples</label>
                <small class="form-text text-muted">A4 dobrdo a meio, 4 páginas A5</small>
                <input type="text" name="bookletSimples" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="BE" id="customCheck9">
                <label class="custom-control-label" for="customCheck9">Booklet Extenso</label>
                <small class="form-text text-muted">Biografias, Fotografias dos intervenientes, etc.</small>
                <input type="text" name="bookletExtended" class="form-control" placeholder="Quantidade">
            </div>
        </div>

        <div class="form-group col-md-4">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Flyers</p>
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="FFa4" id="customCheck10">
                <label class="custom-control-label" for="customCheck10">Formato A4</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="FFa5" id="customCheck11">
                <label class="custom-control-label" for="customCheck11">Formato A5</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
        </div>
    </div>
    <div class ="form-row">
        <div class="form-group col-md-4">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Convites/Cartas</p>
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="VI" id="customCheck12">
                <label class="custom-control-label" for="customCheck12">Versão Impressa</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="DE" id="customCheck13">
                <label class="custom-control-label" for="customCheck13">Digital para Email</label>
                <small class="form-text text-muted">Enviado em formato JPG</small>
            </div>
        </div>
        <div class="form-group col-md-4">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Identificadores</p>
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="prismas" id="customCheck14">
                <label class="custom-control-label" for="customCheck14">Prismas</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="crachas" id="customCheck15">
                <label class="custom-control-label" for="customCheck15">Crachás</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
        </div>
        <div class="form-group col-md-4">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Senhas</p>
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="agua" id="customCheck16">
                <label class="custom-control-label" for="customCheck16">Água/Café</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox col-md-5">
                <input type="checkbox" class="custom-control-input" value="outros" id="customCheck17">
                <label class="custom-control-label" for="customCheck17">Outros</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
        </div>
    </div>
    <div class="form-row">
        <div class="form-group col-md-6">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Layout Formatos Digitais</p>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" class="custom-control-input" value="site" id="customCheck18">
                <label class="custom-control-label" for="customCheck18">Site</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" class="custom-control-input" value="facebook" id="customCheck19">
                <label class="custom-control-label" for="customCheck19">Facebook</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" class="custom-control-input" value="corptv" id="customCheck20">
                <label class="custom-control-label" for="customCheck20">Corp TV</label>
            </div>
            <div class="custom-control custom-checkbox custom-control-inline">
                <input type="checkbox" class="custom-control-input" value="wallpaper" id="customCheck21">
                <label class="custom-control-label" for="customCheck21">Wallpaper Desktop</label>
            </div>
        </div>
        <div class="form-group col-md-6">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Certificados</p>
            </div>
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" value="seNome" id="customCheck22">
                <label class="custom-control-label" for="customCheck22">Sem Nome</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
            </div>
            <div class="custom-control custom-checkbox">
                <input type="checkbox" class="custom-control-input" value="preenchido" id="customCheck23">
                <label class="custom-control-label" for="customCheck23">Preenchido</label>
                <input type="text" name="" class="form-control" placeholder="Quantidade">
                <small class="form-text text-muted">Enviar Lista</small>
            </div>
        </div>
    </div>
    <div class="form-row">
        <div class="form-group col-md-12">
            <div class="p-3 mb-2 bg-secondary text-white">
                <p>Outros</p>
            </div>
            <label for="exampleFormControlTextarea1">Outros</label>
            <textarea name="" class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
        </div>
    </div>
    <div class="form-row">
      <button type="submit" value="submit" class="btn btn-primary">Submit</button>
    </div>
    </form>
</body>
</html>

And this PHP:

<?php
//process.php
if ($_SERVER["REQUEST_METHOD"] == "POST") {//Check it is comming from a form

    $eventDescription = filter_var($_POST["eventDescription"], FILTER_SANITIZE_STRING); //set PHP variables like this so we can use them anywhere in code below
    $askDate = filter_var($_POST["askDate"], FILTER_SANITIZE_STRING);
    $eventDate = filter_var($_POST["eventDate"], FILTER_SANITIZE_STRING);
    $gabinete = filter_var($_POST["gabinete"], FILTER_SANITIZE_STRING);
    $asked = filter_var($_POST["asked"], FILTER_SANITIZE_STRING);
    $quant = ($_POST["quant"]);

    if (empty($eventDescription)){
        die("Insira o nome completo do evento por favor!");
    }
    if (empty($askDate)) {
        die("Insira uma data do pedido por favor!");
    }
    if (empty($eventDate)) {
        die("Insira uma data do pedido por favor!");
    }
    if (empty($gabinete)) {
        die("Insira o gabinete a quem se destina o pedido por favor!");
    }
    if (empty($asked)){
        die("Insira o seu nome por favor!");
    }

    //print output text
    print "O nome do evento é ". $eventDescription ."<br/>";

    if(!empty($_POST['tamanhoCartaz'])) {
        // Counting number of checked checkboxes.
        $checked_count = count($_POST['tamanhoCartaz']);
        print "Escolheu ".$checked_count. " Opções: <br/>";
        // Loop to store and display values of individual checked checkbox.
        foreach($_POST['tamanhoCartaz'] as $key => $selected) {
            print "<p>Escolheu " .$quant[$key]. " impressões do tamanho ".$selected."</p>";
        }
    }
    print "We will contact you very soon!";

}
?>
php html

  • The idea was to be able to choose two or three checkboxes randomly and put text in the textbox then print correctly. At this point I chose for example: The name of the event is test Chose 3 Options: Chose 3 prints of the size A0 Chose 1 prints of the size A1 Chose 0 prints of the size A3 Poster We will contact you very soon! This print is wrong because what I wrote for the A3 posters was 4 but $key is picking up the Indice 3 so write 0.

1 answer

0

How I can remove and print the textbox value associated with a php checkbox

  • You must associate by modifying the attribute name in a way that differentiates inputs and checkboxes.

PS: It is also worth remembering that a checkbox has its value assigned to 1 when it is "checked" and 0 when it is not checked. You should not set a value via attribute value, since, regardless of the user select or not, the value passed will be the value assigned by the programmer.

Watch this block:

<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A0" id="customCheck1">
    <label class="custom-control-label" for="customCheck1">Cartaz A0</label>
    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A1" id="customCheck2">
    <label class="custom-control-label" for="customCheck2">Cartaz A1</label>
    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A2" id="customCheck3">
    <label class="custom-control-label" for="customCheck3">Cartaz A2</label>
    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A3" id="customCheck4">
    <label class="custom-control-label" for="customCheck4">Cartaz A3</label>
    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="tamanhoCartaz[]" value="Cartaz A4" id="customCheck5">
    <label class="custom-control-label" for="customCheck5">Cartaz A4</label>
    <input type="text" name="quant[]" class="form-control" placeholder="Quantidade">
</div>

How "could" be:

<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="cartaz_a0" id="customCheck1">
    <label class="custom-control-label" for="customCheck1">Cartaz A0</label>
    <input type="text" name="quant_cartaz0" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="cartaz_a1" id="customCheck2">
    <label class="custom-control-label" for="customCheck2">Cartaz A1</label>
    <input type="text" name="quant_cartaz1" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="cartaz_a2" id="customCheck3">
    <label class="custom-control-label" for="customCheck3">Cartaz A2</label>
    <input type="text" name="quant_cartaz2" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="cartaz_a3" id="customCheck4">
    <label class="custom-control-label" for="customCheck4">Cartaz A3</label>
    <input type="text" name="quant_cartaz3" class="form-control" placeholder="Quantidade">
</div>
<div class="custom-control custom-checkbox col-md-5">
    <input type="checkbox" class="custom-control-input" name="cartaz_a4" id="customCheck5">
    <label class="custom-control-label" for="customCheck5">Cartaz A4</label>
    <input type="text" name="quant_cartaz4" class="form-control" placeholder="Quantidade">
</div>

Note that each poster has its attributes name differentiated from each other and has no attribute value us checkbox!

Now just you handle this data in the file process.php:

<?php //process.php
    // ...

    if($_POST['cartaz_a0'])
        print "<p>Escolheu " .$_POST['quant_cartaz0']. " impressões do tamanho A0</p>";
    if($_POST['cartaz_a1'])
        print "<p>Escolheu " .$_POST['quant_cartaz1']. " impressões do tamanho A1</p>";
    if($_POST['cartaz_a2'])
        print "<p>Escolheu " .$_POST['quant_cartaz2']. " impressões do tamanho A2</p>";
    if($_POST['cartaz_a3'])
        print "<p>Escolheu " .$_POST['quant_cartaz3']. " impressões do tamanho A3</p>";
    if($_POST['cartaz_a4'])
        print "<p>Escolheu " .$_POST['quant_cartaz4']. " impressões do tamanho A4</p>";

    //...

Logically, they would have other ways to solve this problem, making its form more dynamic. But I see that is not the purpose of your question.

Browser other questions tagged php html

You are not signed in. Login or sign up in order to post.