MP12389
MP12389

Reputation: 305

AJAX/JQuery function undefined

I'm working on a project that allows users to invite other users. When a user gets an invite, a pop-up should, well...pop up...asking them to accept or decline. For this, I'm using an AJAX call to check if they have any invites. This will eventually be an automatically called function, but for now I'm just testing it with a simple button and onclick function.

What happens is, the AJAX request goes to checkInvitations.php, which checks a database table full of users. In plain English, checkInvitations.php checks whether the "user" AJAX sent over has an invitation. If they do, checkInvitations passes information back to the AJAX request with (name of person who invited the user) and (confirmation of an invite).

For whatever reason, though, my function keeps coming up as undefined, even though I've imported the JQuery library. I've no idea why this is the case.

Here's the function with the AJAX request.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript">

function checkForInvitations()
{
    var invitedPlayer = '<?php echo $_SESSION["goodUser"]; ?>' //invitedPlayer = the logged-in user
    console.log("invitedPlayer is: "+invitedPlayer); //variable debug check

$.ajax({
    type: "post",
    url: "checkInvitations.php",
    data: {invitedPlayer: invitedPlayer},

    success: function(data)
    {
        // parse json string to javascript object
        var invitations = JSON.parse(data);
        console.log(invitations); //variable debug check

        // check the invitations to/from
        var invitingPlayer = invitations.invitationFrom;
        var invitationStatus = invitations.invitationStatus;

        //if player has received an invite, pop up a screen asking them to confirm/accept the invite
        if(invitationStatus != 'false')
        {
            clearInterval(checkInvitationIntervalId);
            confirm_yes = confirm(invitingPlayer+" invited you to a game. Accept ?");

        }   
    }
    })
}

And here's the PHP page it requests to

<?php
session_start();

// Create connection
$conn = new mysqli('localhost', 'root', '', 'warzone');

// Check connection
if ($conn->connect_error) 
{
    die("Connection failed: " . $conn->connect_error);
}

$invitations = array();
//look for rows in database where user=the invited user and the invitestatus has been set to true (after invite was sent)
$request = "SELECT * FROM warzone.logged_in_users WHERE USER='".$_POST["invitedPlayer"]."' AND INVITESTATUS='TRUE'";
$res = $conn->query($request);

if($row = $res->fetch_assoc())
{
    $invitations["invitationFrom"]=$row["INVITING_PLAYER"];
    $invitations["invitationStatus"]='true';    
}   
else
{
    $invitations["invitationFrom"]='none';
    $invitations["invitationStatus"]='false';
}

echo json_encode($invitations);

?>

Keep in mind when I use the $_SESSION["goodUser"] in place of $_POST["invitedPlayer"] in the above PHP file, I get the exact output I'm looking for. I know that works. I just can't get it to work with $_POST, obviously, because the AJAX request isn't being made/is broken/is undefined.

Any help is appreciated!

Upvotes: 0

Views: 823

Answers (1)

devilfart
devilfart

Reputation: 347

From the Mozzila Developer API on script tags.

If a script element has a src attribute specified, it should not have a script embedded inside its tags.

Therefor you want to seperate your inclusion of jquery into a seperate tag.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js" type="text/javascript">
</script> 
<!-- end script before you start the one with your code in it -->
<script type="text/javascrpt">

  // Your code that involves $ here...

</script>

Upvotes: 2

Related Questions