Undefined index: Error in ajax POST and/or php script?

Question

I'm trying to send an ajax POST to a php file, however the php file sends a notice of "undefined index", and the php file never seems to receive the value i'm trying to send it. I've been searching for the answer to why this isn't working correctly, so hopefully someone can give me some insight.

My javascript function receives a value from the html, and receives the correct value. (it's "1" in this case)

    function deleteMediaFromDatabase(val)
    {

  $.ajax({ url: 'deleteMediaFromDatabase.php',
         data: {vals : val},
         type: 'post',
         success: function(output) {
                      alert(output);
                  },
          error: function(request, status, error){
            alert("Error: Could not delete");
          }
  });
}

Here is part of my php file that should receive the post:

    <?php

 ini_set("display_errors", "On");
 error_reporting(E_ALL);

    $val = $_POST["vals"];

    // create connection
    $con = mysqli_connect(<stuff you don't care about>);

  error_log($val . ' is the value', 3, "./error.log");

?>

I am, however getting this error message from php:

Notice: Undefined index: vals in /xxx/xxx/htdocs/AdminPanel/deleteMediaFromDatabase.php on line 9

And my javascript always outputs the alert in the error: "Error: Could not delete"

I know this question has been asked and answered many times, however unless I'm skipping over something small, my code, to me, looks correct. (but doesn't it always...)

Answer 1

There is error in syntax of jquery.. You missed out syntax of data. This should be like this-

function deleteMediaFromDatabase(val)
{
$.ajax({ url: 'deleteMediaFromDatabase.php',
     data: {'vals' : val},
     type: 'post',
     dataType:'json',
     success: function(output) {
                  alert(output);
              },
      error: function(request, status, error){
        alert("Error: Could not delete");
      }
});
}

Answer 2

The problem can come from the dataType not being specified or that the dataType specified does not match thus returned by the server.

Explicitely set the dataType, eg dataType:'json'

and make sure that your script returns data that is "encoded" in the data type that you chose, eg in PHP:

echo json_encode($something);

Answer 3

Instead of:

$val = $_POST["vals"];

use this:

if (isset($_POST['vals']) {
    $val = $_POST['vals'];
}

Answer 4

$val = $_POST["vals"];

I got same problem, i tried declaring the variable as global, that solved my problem.

 global $val;
 $val = $_POST["vals"];

and always check isset($_POST["vals"])

Answer 5

Change Ajax syntax...

$.ajax({
    type: "POST",
    url: 'deleteMediaFromDatabase.php',
    data: {'vals' : val},//Have u tried this
    success: function(output) {
        alert(output);
    }
    error: function(request, status, error){
            alert("Error: Could not delete");
    }
);