title: Passing Javascript array to PHP file
body: <p>So I know that Javascript is client-side and PHP is server-side and that complicates thing but I'm wondering how to go about doing this.</p>
  
  <p>I have an array in my javascript code (in a HTML file) and when the user hits my submit button I want the page to send over that array to my PHP page which will then take that date and put it into a SQL database.</p>
  
  <p>Is there a simple way to doing this? My array is declared like this <code>var markers = [];</code> it is just a variable in the javascript portion of the code. </p>
  
  <p>I've looked at a bunch of other posts concerning this but all the solutions will not fit what I need to do, or require WAY too much of a change for what I can do right now. I'm not really familiar with AJAX or JSON (not sure exactly what that is).</p>
  
  <p>My Javascript is:</p>
  
  <pre><code>var markers = [];
  
  function placeMarker(location) {
          var clickedLocation = new google.maps.LatLng(location);
          var name = document.getElementById("checkname").value;
          var description = document.getElementById("description").value;
  
  
          var marker = new google.maps.Marker({
              position: location,
              map: map,
              title: name,
              // This may cause a problem when reloading and editing an existing tour
              // url was found at: http://biostall.com/adding-number-or-letters-to-google-maps-api-markers
              icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&amp;chld=' + markerId + '|FE6256|000000'
          });
  
          marker.setMap(map);
          markers.push([markerId, name, marker.getPosition().lat(), marker.getPosition().lng(), description]);
          //alert("" + markers);
          markerId = markerId + 1;
      }
  
      google.maps.event.addListener(map, 'click', function(event) {
          placeMarker(event.latLng);
      });
  
      google.maps.event.addListener(marker, "click", function() {
          map.removeOverlay(marker);
          marker.setMap(map);
      });
  } 
  
  window.onload = function() {
      var form = document.getElementById('theform');
      form.addEventListener('submit', function(){
          var markersField = document.getElementById('markers');
          markersField.value = JSON.stringify(markers);
      });
  }
  </code></pre>
  
  <p>My HTML is:</p>
  
  <pre><code>&lt;form action="portal.php" method="post" id="theform"&gt;
      &lt;input type="hidden" id="markers" name="markers"&gt;
      &lt;button&gt;Submit&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>In my portal.php file I have:</p>
  
  <pre><code>$markers = json_decode($_POST['markers']);
  echo $markers;
  </code></pre>
  
  <p>Nothing prints out in the php page even though I know there are elements in the array, this leads me to believe the array is not being passed over.</p>