Php Radio Buttons Get Selected Value example

Admin   HTML5 - CSS   155  2021-03-12 22:00:07

Hi Guys,

Today,I will learn you how to create radio buttons get selected value in php. we will show example of php radio buttons get selected value.you can easliy create radio buttons get selected value in php.

Here, I will give you full example for simply radio buttons get selected value using php as bellow.

Example

 

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>Radio Buttons in PHP</title>

<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:[email protected]&display=swap" rel="stylesheet">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

<style>

body{

font-family: 'JetBrains Mono', monospace;

background:#d2d2d2;

}

.error{

color:red;

}

select{

width: 100%;

min-height: 150px;

margin-bottom: 20px;

}

input[type="submit"] {

display: block;

margin: 20px auto;

}

label{

display: block;

position: relative;

cursor: pointer;

font-size: 18px;

padding-left: 46px;

margin-bottom: 15px;

-webkit-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

}

label input {

position: absolute;

opacity: 0;

cursor: pointer;

}

.select{

top: 0;

left: 0;

height: 25px;

width: 25px;

position: absolute;

border-radius: 50%;

background-color: #cccccc;

}

label:hover input~.select {

background-color: #ccc;

}

label input:checked~.select {

background-color: #1A33FF;

}

.select:after {

content: "";

position: absolute;

display: none;

}

label input:checked~.select:after {

display: block;

}

label .select:after {

top: 9px;

left: 9px;

width: 8px;

height: 8px;

border-radius: 50%;

background: white;

}

.select-tag{

background:#48161D;

color:#fff;

border-radius:15px;

display: inline-block;

font-size:14px;

padding:3px 15px;

margin-left:5px;

}

.main-box{

border-radius:5px;

background:#fff;

padding:15px;

border:1px solid #48161D;

box-shadow:2px 2px 5px #d2d2d2;

}

</style>

</head>

<body>

<div class="container mt-5 pt-5">

<div class="row mt-5">

<div class="col-md-6 main-box offset-md-3">

<form action="" method="post">

<div class="row">

<div class="col-md-12 text-center title mb-2">

<h4><strong>Radio Buttons in PHP</strong></h4>

</div>

<div class="col-md-12 mt-4">

<div class="row">

<div class="col-md-6">

<label>

<input type="radio" name="radio" value="Laravel">Laravel

<span class="select"></span>

</label>

</div>

<div class="col-md-6">

<label>

<input type="radio" name="radio" value="Php">Php

<span class="select"></span>

</label>

</div>

<div class="col-md-6">

<label>

<input type="radio" name="radio" value="NodeJs">NodeJs

<span class="select"></span>

</label>

</div>

<div class="col-md-6">

<label>

<input type="radio" name="radio" value="Bootstrap">Bootstrap

<span class="select"></span>

</label>

</div>

</div>

</div>

<div class="col-md-12">

<input type="submit" name="submit" vlaue="Get Values" class="btn btn-success btn-sm">

</div>

<div class="col-md-12 text-center mt-2">

<?php

if(isset($_POST['submit'])){

if(!empty($_POST['radio'])) {

echo '<p class="select-tag mt-3">'.$_POST['radio'].'</p>';

}else{

echo '<p class="error alert alert-danger mt-3">Please Select Any Radio.';

}

}

?>

</div>

</div>

</form>

</div>

</div>

</div>

</body>

</html>

it will help you...