Really bizarre bug when using jquery ajax and php

Question

I'm trying to create a like button for different images posted by user. This is my html :

<a href="#" title="like" class="likes" id="<?php echo $row['id']?>">Like</a>

This is my javascript:

<script>
$(function(){
  $(".likes").click(function(){

    var postid = $(this).attr("id"); 
    alert(postid);
      $.ajax({
                type:'POST',
                url:'likes.php',
                data:'id='+postid,
                success:function(data){
                    alert("success");
                }
            });

});
});
</script>

This is likes.php, for testing purpose it's quite simple:

<?php
require('config.php');
$postid=$_POST['id'];
echo $postid;
?>

When I clicked the like button, a small window will correctly postid, and then "success",which indicates that the ajax is successful, however, when I opened likes.php, I got an error that says: Notice: Undefined index: id in C:\XAMPP\htdocs\likes.php on line 3

I tried adding e.preventDefault(). I tried different syntax，such as data:'id='+postid, data:{id:postid},data:{'id':postid},etc. I experimented with basically all combinations of single quotes and double quotes. I also tried adding datatype:html and datatype:text. Every time I just got a alert that says "success", but when I open likes.php, $_POST['id'] is always undefined.

Can someone help me please this bug took me a lot of time.

Update: I found that even if I entered a completely non-existing url, like url:"aabbll.php", after I clicked the "like" button, I would still see a window that alerts "success", why does the page keep alerting "success" even though clearly the AJAX process wasn't a success?

By open you mean put in the url of your local file in your web browser? — Lixus
– Lixus, Commented May 3, 2017 at 22:33

Benjaco · Accepted Answer · 2017-05-07 21:48:28Z

3

You are not sending the post variable "id" when you are opening like.php in a new browser window.

The error "Notice: Undefined index" is shown because the $_POST array does not contain the id field.

You can use a chrome extension called postman to test endpoints with post variables.

A tip to improve the code could be to wrap it in an if isset statement

if(isset($_POST['id'])){
    // this code will only be executed if the post variable is sent to the page
    $postid=$_POST['id'];
    // update database
    echo "Success";
}else{
    echo "ERROR: No id post variable found";
}

Your javascript code is sending the post variable

edited May 7, 2017 at 21:48

answered May 3, 2017 at 22:38

Benjaco

3033 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

gravition Over a year ago

If i put if(isset($_POST['id'])) and open likes.php, i will just get an empty page regardless of what code I put inside that isset statement. I think that's because $_POST is null, but my ajax code seems correct, is there anything I can do to fix this?

Benjaco Over a year ago

i have updated my answer to give the request a better response to the user

muchar · Accepted Answer · 2017-05-04 14:37:49Z

0

Try to put var_dump($_POST) to see what you really post.

edited May 4, 2017 at 14:37

answered May 3, 2017 at 23:14

muchar

596 bronze badges

2 Comments

nicholasnet Over a year ago

It's var_dump not vardump

muchar Over a year ago

Yup. My mistake.

nicholasnet · Accepted Answer · 2017-05-04 15:45:28Z

0

Couple of suggestions.

Your JS can be simply

<script>
$(function() {

    $('.likes').on('click', function() {

        var postid = $(this).attr('id'); 
        $.post("likes.php", {id: postid}).done(function( data ) {

            alert( 'Data Loaded: ' + data );
        });
    });
});

For your PHP

<?php
if (!isset($_POST['id'])) {

    /// Do what you want to do in this case.
}

$id = $_POST['id'];

// If using PHP7
$id = $_POST['id'] ?? null;

Though $('.likes') works try to avoid that since it is slowest selector in most cases.

edited May 4, 2017 at 15:45

answered May 4, 2017 at 14:39

nicholasnet

2,3174 gold badges25 silver badges55 bronze badges

Collectives™ on Stack Overflow

Really bizarre bug when using jquery ajax and php

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related