Apa nilai kotak centang di php?

Kotak centang juga dikenal sebagai kotak centang atau kotak pilihan. Kotak centang adalah komponen antarmuka pengguna kecil yang memungkinkan pengguna memilih lebih dari satu opsi dari daftar opsi yang diberikan

Kami akan membuat daftar buah kecil menggunakan HTML 5 dan menampilkan daftar kotak centang itu kepada pengguna untuk memilih lebih dari satu opsi. Kami akan mendapatkan beberapa nilai dari kotak centang yang dipilih dengan PHP 8 dan belajar menerapkan validasi beberapa kotak centang di PHP

Jika Anda memulai dengan PHP, lihat artikel terperinci kami di Membangun CRUD REST API di PHP dan MySQL dan Mendapatkan Nilai Opsi Pilihan Ganda di PHP

Buat Formulir dengan Beberapa Kotak Centang

Buat formulir menggunakan elemen formulir HTML, tentukan bidang input dengan nilai type="checkbox". checkArr[]_ adalah objek array yang didefinisikan dalam nama-nilai, yang digunakan untuk berkomunikasi dengan PHP

<form action="" method="post">
  <label>
    Apple
    <input type="checkbox" name="checkArr[]" value="Apple">
  </label>
  <label>
    Banana
    <input type="checkbox" name="checkArr[]" value="Banana">
  </label>
  <label>
    Coconut
    <input type="checkbox" name="checkArr[]" value="Coconut">
  </label>
  <label>
    Blueberry
    <input type="checkbox" name="checkArr[]" value="Blueberry">
  </label>
  <input type="submit" name="submit" value="Choose options" />
</form>

Baca Beberapa Nilai dari Kotak Centang yang Dipilih

Metode isset($_POST['submit']) memeriksa apakah nilai kirim dinyatakan atau tidak

Dalam fungsi isset, kami menggunakan validasi lain dan memastikan apakah nilai kotak centang disetel atau tidak menggunakan fungsi empty()

Gunakan loop foreach()_ untuk mengulangi setiap nilai kotak centang yang dipilih dan mencetak di layar pengguna

<?php
  if(isset($_POST['submit'])){
      if(!empty($_POST['checkArr'])){
      foreach($_POST['checkArr'] as $checked){
        echo $checked."</br>";
      }
    }
  }
?>

Kotak centang Validasi dalam PHP

Untuk menambahkan validasi di kotak centang, tempatkan kode berikut di template PHP Anda

<?php
  if(isset($_POST['submit'])){
      if(!empty($_POST['checkArr'])){
        foreach($_POST['checkArr'] as $checked){
          echo $checked . '<br>';
        }
      } else {
        echo '<div class="error">Checkbox is not selected!</div>';
      }
  }
?>

Kotak centang dengan Gaya Kustom

Tambahkan tag span di bawah kolom input untuk menambahkan gaya khusus di kotak centang

<form action="" method="post">
  <label>
    Apple
    <input type="checkbox" name="checkArr[]" value="Apple">
    <span></span>
  </label>
  <label>
    Banana
    <input type="checkbox" name="checkArr[]" value="Banana">
    <span></span>
  </label>
  <label>
    Coconut
    <input type="checkbox" name="checkArr[]" value="Coconut">
    <span></span>
  </label>
  <label>
    Blueberry
    <input type="checkbox" name="checkArr[]" value="Blueberry">
    <span></span>
  </label>
  <input type="submit" name="submit" value="Choose options" />
</form>

Kotak centang gaya hanya dengan HTML dan CSS

label {
  display: block;
  position: relative;
  padding-left: 35px;
  margin-bottom: 20px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  line-height: 25px;
}
/* Hide the browser's default checkbox */
label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
/* Create a custom checkbox */
span {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #cccccc;
}
label:hover input~span {
  background-color: #cccccc;
}
label input:checked~span {
  background-color: #1A33FF;
}
span:after {
  content: "";
  position: absolute;
  display: none;
}
label input:checked~span:after {
  display: block;
}
label span:after {
  left: 9px;
  top: 5px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

Contoh Kode Kotak Centang Final PHP 8

Berikut adalah contoh kode lengkap untuk kotak centang di PHP

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>PHP - Get Multiple Checkbox Value DEMO</title>
</head>
<body>
  <div class="container mt-5">
    <form action="" method="post" class="mb-3">
      <label>
        Apple
        <input type="checkbox" name="checkArr[]" value="Apple">
        <span></span>
      </label>
      <label>
        Banana
        <input type="checkbox" name="checkArr[]" value="Banana">
        <span></span>
      </label>
      <label>
        Coconut
        <input type="checkbox" name="checkArr[]" value="Coconut">
        <span></span>
      </label>
      <label>
        Blueberry
        <input type="checkbox" name="checkArr[]" value="Blueberry">
        <span></span>
      </label>
      <input type="submit" name="submit" value="Choose options" />
    </form>
    <?php
      if(isset($_POST['submit'])){
          if(!empty($_POST['checkArr'])){
            foreach($_POST['checkArr'] as $checked){
              echo $checked . '<br>';
            }
          } else {
            echo '<div class="error">Checkbox is not selected!</div>';
          }
      }
    ?>
  </div>
</body>
</html>

Kesimpulan

Dalam tutorial ini kita belajar cara bekerja dengan kotak centang. Kami telah melihat cara mendapatkan banyak nilai dan menerapkan validasi dalam PHP

Digamber

Saya Digamber, full-stack developer dan pecinta kebugaran. Saya membuat situs ini untuk memberikan pengalaman coding saya dengan programmer pemula. Saya suka menulis di JavaScript, ECMAScript, React, Angular, Vue, Laravel

Posting yang Direkomendasikan

Build PHP MySQL 5 Star Rating System menggunakan jQuery AJAXPHP 8 AJAX Live Data Search dengan MySQL TutorialPHP 8 Select2 Multi Select dengan jQuery AJAX TutorialPHP 8 JSON Data Encode and Decode ContohPHP 8 Server Side Form Validasi Tutorial ContohMengintegrasikan Google reCAPTCHA di PHP 8 Formulir KontakCara Membuat Captcha . Get Selected Value and Add StyleCara Mendapatkan Selected Values ​​dari Select Option di PHP 8Membuat Pagination di PHP 8 dengan MySQL dan BootstrapBuild Formulir Pendaftaran Pengguna (Signup) PHP 8 dengan MySQL

Bagaimana cara memeriksa nilai kotak centang di PHP?

Apa nilai kotak centang?

Apakah kotak centang memiliki nilai?

Nilai apa yang dikembalikan oleh kotak centang?