How to use Select2 for Multiple Select in PHP 8?

PHP 8

Nicesnippets

24-05-2022


How to use Select2 for Multiple Select in PHP 8?

Hello Friend,

In this article we will cover on how to implement How to use select2 for multiple select in PHP 8. I would like to share with you PHP 8 Select2 Multiple Select Example Tutorial. I’m going to show you about Select2 - The jQuery replacement for select boxes in PHP 8.

I explained simply about How to get multiple selected values of select box in php 8?

Here I will give full examle for select2 multiple select option and store to database in php. So Lets follow bellow step.

multiSelect.php


<html lang="en">

<head>

<title>How to use Select2 for Multiple Select in PHP 8?</title>

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha256-aAr2Zpq8MZ+YA/D6JtRD3xtrwpEz2IqOS+pWD/7XKIw=" crossorigin="anonymous" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha256-OFRAJNoaD8L3Br5lglV7VyLRf0itmoBzWUoM+Sji4/8=" crossorigin="anonymous"></script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />

<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>

</head>

<body>

<div class="row mt-5">

<div class="col-md-6 offset-3 mt-5">

<div class="card">

<div class="card-header bg-info text-white">

<h4>How to use Select2 for Multiple Select in PHP 8? - Nicesnippets.com</h4>

</div>

<div class="card-body" style="height: 280px;">

<form action="multiSelectPro.php" method="post">

<div class="form-group">

<label>Title :</label>

<input type="title" name="title" class="form-control">

</div>

<div class="form-group">

<label>Category :</label>

<select class="category related-post form-control" name="category[]" multiple>

<option value="1">Laravel</option>

<option value="2">Jquery</option>

<option value="3">React</option>

<option value="4">Jquery ui</option>

<option value="5">Android</option>

<option value="6">React Native</option>

<option value="7">Vue js</option>

<option value="8">Bootstrap 4</option>

</select>

</div>

<div class="form-group">

<button class="btn btn-success store-related-post btn-sm">Save</button>

</div>

</form>

</div>

</div>

</div>

</div>

<script type="text/javascript">

$(document).ready(function() {

$('.category').select2();

});

</script>

</body>

</html>

multiSelectPro.php

<?php

define (DB_USER, "root");//Username

define (DB_PASSWORD, "root");//Password

define (DB_DATABASE, "new_blog"); //Database Name

define (DB_HOST, "localhost");

$mysqli = new mysqli(DB_HOST, DB_USER, DB_PASSWORD, DB_DATABASE);

$title = $_POST['title'];

$category = implode(', ', $_POST['category']);

$created_at = date();

$sql = "INSERT INTO posts (title,category) VALUES ('$title', '$category')";

$result = $mysqli->query($sql);

header('location:multiSelect.php')

?>

Output :

It will help you...