jh95 jh95 - 12 days ago 4
PHP Question

How can I pass Javascript array to a PHP array on button click?

I am having trouble passing a Javascript array to a PHP array on the same page when the submit button is pressed. I have seen discussion of JSON.stringify and json_encode on other posts, but I am not sure how to use those functions with my code.

JS:

<script>
var kegs = [];
var textarea = document.getElementById("your_textarea");
$("#kegId").on('keyup', function (e) {
if (e.keyCode == 13) {
kegs.push($(this).val());
$("#kegId").val("");
textarea.value = kegs.join("\n");

};
});
</script>


PHP:

if (!isset($_POST['btn-addkegs'])) {
//I want to set the Javascript array 'kegs' to a php variable here

Answer

Using Ajax will do it for you! I have wrote this code that sends an array to PHP on the same page. Once you get the array in PHP you can do whatever you want with it :).Just copy and paste this file and called the file index.php to see the result. This will totally help you!

<?php

  $data = array();
   if(isset($_POST['myArray']) && !empty($_SERVER['HTTP_X_REQUESTED_WITH'])){
   $data = 'You array is: ' . $_POST['myArray'];       
   echo json_encode($data);  
   die();      
   }
?>
 <html>
 <head>
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>

<body>
<div id = "random"></div>

<script type = "text/javascript">

$(document).ready(function() {

var arr = [2,4,5,6,7];
var myArray =  JSON.stringify(arr);

$.ajax({
    url: "index.php",
    method: "POST",
    dataType: "json",
    data: {myArray: myArray},
    success: function (result) {
    alert("result: " + result);
    console.log(result);
  $("#random").html(result);
 }
});

});

</script>

</body>
</html>
Comments