title: "A non-numeric value encountered" in AJAX Request. Why aren't the values being captured?
body: <p>Using AJAX to send form information to a php processing page. Doing a var_dump reveals that the values are coming in as "0", even though the numbers entered are not. Even though the values are specified as "(int)" PHP7 returns a "A non-numeric value encountered in /process_measurements.php on line 20".</p>
  
  <p>If I explicitly typecast them as follows the PHP errors goes away, however, the var_dump shows that they are coming in as 0s.. not the values entered into the form so the calculation result is 0, no matter the values entered in the form.</p>
  
  <pre><code>$length = (int)$length;
  $width = (int)$width;
  $height = (int)$height;
  </code></pre>
  
  <p>The code as it shows the "non-numeric value encountered" error:</p>
  
  <pre><code>&lt;?php
    function is_ajax_request() {
      return isset($_SERVER['HTTP_X_REQUESTED_WITH']) &amp;&amp;
        $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
    }
  
    (int)$length = isset($_POST['length']) ? (int) $_POST['length'] : '';
    (int)$width = isset($_POST['width']) ? (int) $_POST['width'] : '';
    (int)$height = isset($_POST['height']) ? (int) $_POST['height'] : '';
  
    var_dump($length, $width, $height);
  
    $volume = $length * $width * $height;
  
    if(is_ajax_request()) {
      echo $volume;
    } else {
      exit;
    }
  ?&gt;
  
  HTML and JS for further clarification:
  
      &lt;div id="measurements"&gt;
        &lt;p&gt;Enter measurements below to determine the total volume.&lt;/p&gt;
        &lt;form id="measurement-form" action="process_measurements.php" method="POST"&gt;
          Length: &lt;input type="text" name="length" /&gt;&lt;br /&gt;
          &lt;br /&gt;
          Width: &lt;input type="text" name="width" /&gt;&lt;br /&gt;
          &lt;br /&gt;
          Height: &lt;input type="text" name="height" /&gt;&lt;br /&gt;
          &lt;br /&gt;
          &lt;input id="html-submit" type="submit" value="Submit" /&gt;
          &lt;input id="ajax-submit" type="button" value="Ajax Submit" /&gt;
        &lt;/form&gt;
      &lt;/div&gt;
  
  &lt;script&gt;
        var result_div = document.getElementById("result");
        var volume = document.getElementById("volume");
  
        function postResult(value) {
          volume.innerHTML = value;
          result_div.style.display = 'block';
        }
  
        function clearResult() {
          volume.innerHTML = '';
          result_div.style.display = 'none';
        }
  
        // omits textareas, select-options, checkboxes, radio buttons
        function gatherFormData(form) {
          var inputs = form.getElementsByTagName('input');
          var array = [];
          for (i = 0; i &lt; inputs.length; i++) {
            var inputNameValue = inputs[i].name + '=' + inputs[i].value;
            array.push(inputNameValue);
          }
          return array.join('&amp;');
        }
  
        function calculateMeasurements() {
          clearResult();
  
          var form = document.getElementById("measurement-form");
          var action = form.getAttribute("action");
  
          // gather form data
          var form_data = gatherFormData(form);
  
          var xhr = new XMLHttpRequest();
          xhr.open('POST', action, true);
          // do not set content-type with FormData
          //xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
          xhr.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
          xhr.onreadystatechange = function () {
            if(xhr.readyState == 4 &amp;&amp; xhr.status == 200) {
              var result = xhr.responseText;
              console.log('Result: ' + result);
              postResult(result);
            }
          };
          xhr.send(form_data);
        }
  
        var button = document.getElementById("ajax-submit");
        button.addEventListener("click", calculateMeasurements);
  
      &lt;/script&gt;
  </code></pre>