Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
How to add more values to the array on a button click using PHP?
Adding more values to an array on a button click in PHP requires combining PHP server-side processing with HTML forms. This functionality is essential for creating dynamic web applications where users can modify array data through user interactions.
Using HTML Forms
The most straightforward approach uses an HTML form to submit new values to PHP, which then adds them to the array ?
<?php
session_start();
if (!isset($_SESSION['array'])) {
$_SESSION['array'] = array();
}
if (isset($_POST['submit'])) {
$new_value = $_POST['new_value'];
if (!empty($new_value)) {
array_push($_SESSION['array'], $new_value);
}
}
?>
<!DOCTYPE html>
<html>
<head>
<title>Add Values to Array</title>
</head>
<body>
<form method="POST">
<input type="text" name="new_value" placeholder="Enter a value" required>
<input type="submit" name="submit" value="Add to Array">
</form>
<?php
if (!empty($_SESSION['array'])) {
echo "<h3>Current Array:</h3>";
echo "<pre>";
print_r($_SESSION['array']);
echo "</pre>";
}
?>
</body>
</html>
Using AJAX with JavaScript
For a more dynamic experience without page refreshes, use AJAX to send values to PHP ?
<!DOCTYPE html>
<html>
<head>
<title>AJAX Array Addition</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
<input type="text" id="new_value" placeholder="Enter a value">
<button onclick="addValue()">Add to Array</button>
<div id="result"></div>
<script>
function addValue() {
var value = document.getElementById("new_value").value;
if (value.trim() !== "") {
$.ajax({
type: 'POST',
url: 'process.php',
data: {new_value: value},
success: function(response) {
$('#result').html(response);
document.getElementById("new_value").value = "";
}
});
}
}
</script>
</body>
</html>
The corresponding process.php file ?
<?php
session_start();
if (!isset($_SESSION['array'])) {
$_SESSION['array'] = array();
}
if (isset($_POST['new_value'])) {
$new_value = $_POST['new_value'];
array_push($_SESSION['array'], $new_value);
echo "<h3>Updated Array:</h3>";
echo "<pre>";
print_r($_SESSION['array']);
echo "</pre>";
}
?>
Installation Requirements: To run these examples, you need a local server like XAMPP, WAMP, or LAMP. Place the PHP files in the htdocs directory and access them via http://localhost/filename.php
Key Points
-
Sessions: Use
$_SESSIONto persist array data across requests - Validation: Always validate input before adding to arrays
- Form Method: Use POST method for data submission
- AJAX Benefits: Provides seamless user experience without page reloads
Conclusion
Both form-based and AJAX approaches effectively add values to arrays on button clicks. Use HTML forms for simple implementations and AJAX for dynamic, interactive user experiences without page refreshes.
Updated on: 2026-03-15T10:18:44+05:30
5K+ Views
Advertisements