Home Whiteboard Practice Code Graphing Calculator Online Compilers Articles Tools
Tutorials Courses Jobs

How can I send radio button value in PHP using JavaScript?

PHP Server Side Programming Programming Javascript

In PHP, you can send radio button values using JavaScript by capturing the selected value on the client side and then sending it to PHP via AJAX or form submission. Here's how to implement both approaches ?

HTML Form with Radio Buttons

First, create a form with radio buttons that have unique values ?

<form id="controls" method="POST" action="process.php">
    <label class="btn btn-primary active">
        <input type="radio" name="option_avail" value="Option_one" checked /> First Option
    </label>
    <label class="btn btn-primary">
        <input type="radio" name="option_avail" value="Option_two" /> Second Option
    </label>
    <label class="btn btn-primary">
        <input type="radio" name="option_avail" value="Option_three" /> Third Option
    </label>
    <button type="submit">Submit</button>
</form>

Method 1: Using JavaScript with AJAX

Capture radio button value with JavaScript and send via AJAX ?

<script>
function sendRadioValue() {
    var option_avail = $('input[name=option_avail]:checked', '#controls').val();
    
    $.ajax({
        url: 'process.php',
        type: 'POST',
        data: { option_avail: option_avail },
        success: function(response) {
            console.log('Response: ' + response);
        }
    });
}

// Send value when radio button changes
$('input[name=option_avail]').change(function() {
    sendRadioValue();
});
</script>

Method 2: Traditional Form Submission

Handle form submission with JavaScript validation before sending to PHP ?

<script>
$('#controls').submit(function(e) {
    var option_avail = $('input[name=option_avail]:checked').val();
    
    if (!option_avail) {
        alert('Please select an option');
        e.preventDefault();
        return false;
    }
    
    console.log('Sending value: ' + option_avail);
});
</script>

PHP Processing Script

Create a PHP script to receive and process the radio button value ?

<?php
// process.php
if ($_POST['option_avail']) {
    $selected_option = $_POST['option_avail'];
    
    switch($selected_option) {
        case 'Option_one':
            echo "You selected the first option";
            break;
        case 'Option_two':
            echo "You selected the second option";
            break;
        case 'Option_three':
            echo "You selected the third option";
            break;
        default:
            echo "Invalid option selected";
    }
} else {
    echo "No option was selected";
}
?>

Complete Working Example

Here's a complete example combining HTML, JavaScript, and PHP ?

<!DOCTYPE html>
<html>
<head>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <div id="controls">
        <input type="radio" name="option_avail" value="Option_one" checked /> First Option<br>
        <input type="radio" name="option_avail" value="Option_two" /> Second Option<br>
        <input type="radio" name="option_avail" value="Option_three" /> Third Option<br>
        <button onclick="sendValue()">Send to PHP</button>
    </div>
    
    <script>
    function sendValue() {
        var option_avail = $('input[name=option_avail]:checked', '#controls').val();
        alert('Selected value: ' + option_avail);
        // This value can now be sent to PHP via AJAX or form submission
    }
    </script>
</body>
</html>

Conclusion

Use jQuery's selector $('input[name=option_avail]:checked').val() to get radio button values in JavaScript. Send to PHP via AJAX for dynamic updates or form submission for traditional processing.

Updated on: 2026-03-15T08:36:30+05:30

409 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements