Donald Faulknor
Donald Faulknor

Reputation: 37

How can I fix my Ajax Insert Query acting as GET?

I'm very new to Ajax and I've noticed when the "like" button is clicked, the url changes to act as a get. Such as ?videoID=18&userID=11&insert-like=.

Here's my code:

<script>
  $(function () {
    $('button').click(function () {
      var videoID271 = $('#videoID').val();
      var userID271 = $('#userID').val();
      console.log('starting ajax');
      $.ajax({
        url: "./insert-like.php",
        type: "post",
        data: { videoID: videoID271, userID: userID271 },
        success: function (data) {
          var dataParsed = JSON.parse(data);
          console.log(dataParsed);
        }
      });

    });
  });

</script>

<form>
<input type="hidden" name="videoID" id="videoID" value="<?php echo $id123; ?>" />
<input type="hidden" name="userID" id="userID" value="<?php echo $userID; ?>" />
<button type="submit" name="insert-like" style="background:none;border:none;text-decoration:none; color:#DD4400;font-weight:bold">Like</button>
</form>

if($_POST['videoID']) {
    $videoID = $_POST['videoID'];
    $userID = $_POST['userID'];

    $query271 = "INSERT INTO video_likes(video_id,user_id) VALUES(:video_id271,:user_id271)";
    $stmt271 = $pdo->prepare($query271);
    $stmt271->bindValue(':video_id271',$videoID);
    $stmt271->bindValue(':user_id271',$userID);
    $stmt271->execute();
}

I tried using this Stack Overflow and changing to my needs. Any help is greatly appreciated.

Upvotes: -1

Views: 26

Answers (1)

iJamesPHP2
iJamesPHP2

Reputation: 534

This is because your button is type="submit"

This will make it submit the form normally. Remove it.

Upvotes: 1

Related Questions