Argthtjtr

I was creating a small game for childrens. The game is completed building but the problem am facing is the show the alert boxes when needed. Sometimes it shows sometimes it doesn't. When I pressed inspect element I found that its getting printed on the console but not coming in alert box. Sometimes when I hard reset the browser it shows the alert box when needed. I cleared the browser cache and tried its works sometimes and sometimes not. But its getting printed on the console properly as per my code.

Please someone help me on this issue. I have never faced these kind of issue, its very strange and am tensed.

Below is my jquery code:

<script>

$(document).ready(function(){



    $("#feed_btn").hide();

    $("#finish_btn").hide();



    $("#start_btn").click(function(){

        $("#start_btn").hide();

        $("#feed_btn").show();



    });

});



function RestartGame()

{

    location.reload();

}



var i=0;



function PerformGame()

{

    i++;

    $.ajax({

        url: 'perform_game.php',

        type: "POST",

        data: {'button_clicked': i},

        dataType: 'json',



        success: function(data) {



            if(data == "Maximum Clicks Reached. You Lose !") {

                swal({title: "Game Over !", text: data, type: "error"});

                $("#feed_btn").hide();

                $("#finish_btn").show();

            }

            if(data == "Maximum Clicks Reached. You Won !") {

                swal({title: "Wow !",text: data,type: "success"});

                $("#feed_btn").hide();

                $("#finish_btn").show();

            }

            if(data == "Hard Luck ! One or Some animal(s) died.") {

                swal({title: "Dead !",text: data,type: "warning"});

            }

               if(data == "Farmer Died ! You Lose !"){

                    swal({title: "Game Over !", text: data, type: "error"});

                    $("#feed_btn").hide();

                    $("#finish_btn").show();

               }



            }

    });

}   

</script>

Below is my php code:

foreach($_SESSION['animal_life'] as $key => $value)

{

    if ($value == '0') {

        if ($key == 'Farmer'){

            $msg = "Farmer Died ! You Lose !";

            unset($_SESSION['animals']);

            unset($_SESSION['animal_life']);

            unset($_SESSION['final_result']);

            break;

        }



        $search_animal = array_search($key, $_SESSION['animals']);

        unset($_SESSION['animals'][$search_animal]);

    }

    $check_animals_left = count($_SESSION['animals']);

    if($check_animals_left < $count_total_animals) {

        $msg = "Hard Luck ! One or Some animal(s) died.";

    }

}



if ($no_of_times_button_clicked == '50') {

    $counter = 0;

    if (in_array('Farmer', $_SESSION['animals'])) {

        $counter++;

    }



    if (in_array('Cow1', $_SESSION['animals']) || in_array('Cow2', $_SESSION['animals'])) {

        $counter++;

    }



    if (in_array('Bunny1', $_SESSION['animals']) || in_array('Bunny2', $_SESSION['animals']) || in_array('Bunny3', $_SESSION['animals']) || in_array('Bunny4', $_SESSION['animals']))

    {

        $counter++;

    }



    if ($counter == 3)

    {

        $msg = "Maximum Clicks Reached. You Won !";

        unset($_SESSION['animals']);

        unset($_SESSION['animal_life']);

        unset($_SESSION['final_result']);

    } else {

        $msg = "Maximum Clicks Reached. You Lose !";

        unset($_SESSION['animals']);

        unset($_SESSION['animal_life']);

        unset($_SESSION['final_result']);

    }

}



if ($msg) {

    echo json_encode($msg);     

}

}

Please add this debug:

console.log('data is: ',data)

console.log('data == Maximum Clicks Reached. You Lose !',data == "Maximum Clicks Reached. You Lose !")

if(data == "Maximum Clicks Reached. You Lose !") {

    swal({title: "Game Over !", text: data, type: "error"});

    $("#feed_btn").hide();

    $("#finish_btn").show();

}

console.log('data == Maximum Clicks Reached. You Won',data == "Maximum Clicks Reached. You Won !")

if(data == "Maximum Clicks Reached. You Won !") {

    swal({title: "Wow !",text: data,type: "success"});

    $("#feed_btn").hide();

    $("#finish_btn").show();

}

console.log('data == Hard Luck ! One or Some animal(s) died.',data == "Hard Luck ! One or Some animal(s) died.")

if(data == "Hard Luck ! One or Some animal(s) died.") {

    swal({title: "Dead !",text: data,type: "warning"});

}

console.log('data == Farmer Died ! You Lose !',data == "Farmer Died ! You Lose !")

   if(data == "Farmer Died ! You Lose !"){

        swal({title: "Game Over !", text: data, type: "error"});

        $("#feed_btn").hide();

        $("#finish_btn").show();

   }



}

Try this:

$.ajax({

    url: 'perform_game.php',

    type: "POST",

    data: {'button_clicked': i},

    dataType: 'json',

    async:false



    success: function(data) {



        if(data == "Maximum Clicks Reached. You Lose !") {

            swal({title: "Game Over !", text: data, type: "error"});

            $("#feed_btn").hide();

            $("#finish_btn").show();

        }

        if(data == "Maximum Clicks Reached. You Won !") {

            swal({title: "Wow !",text: data,type: "success"});

            $("#feed_btn").hide();

            $("#finish_btn").show();

        }

        if(data == "Hard Luck ! One or Some animal(s) died.") {

            swal({title: "Dead !",text: data,type: "warning"});

        }

           if(data == "Farmer Died ! You Lose !"){

                swal({title: "Game Over !", text: data, type: "error"});

                $("#feed_btn").hide();

                $("#finish_btn").show();

           }



        }

});