Little Sauce Little Sauce - 6 months ago 16
Javascript Question

Javascript variable to PHP variable - Post if statement isnt working

my

if(isset($_POST['height'])){
is just going straight to
else{}
what is the reason for this?. so basically it's suppose to detect the height of a div. Send it back to the PHP where it is compared to 1 and echo different statements depending on the product. I am wanting to keep it AJAX so that I am able to do detect the height of a div and send it to a PHP if statement without having to refresh the page. if you have any idea what's going on it would be much appreciated. papa bless.

PHP

<?php

if(isset($_POST['height'])){
$solo_height = $_POST['height'];

if ($solo_height > 1){
//HERE YOU SHOULD ECHO BACK A RESPONSE TO THE AJAX CALL
echo '<div class="view_full_post">View Full Post</div>';
// WHAT DOES $this->output($var); DO??? I HAVE NO CLUE...
// SO JUST ECHO THE DIV JUST FOR TESTING...
}else{
echo "The Height is Less than a Thousand... What do we do sir???";
}
}
?>


Ajax

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
(function ($) {
$(document).ready(function(e) {
view_height = $("#view_height").height();
$.ajax({
type: "POST",
url: "index.php", // POINTS TO THE PROCESSING FILE WE CREATED ABOVE
data:{ height: view_height },
success: function(data){
console.log(view_height); // NOW YOU SHOULD BE ABLE TO GET A RESPONSE....
// UPDATE THE DIV THAT YOU WANTED TO...
// ==> HERE IS THE NEW UPDATE REFLECTING YOUR USE CASE:
// ==> ADD THE DIV RIGHT AT THE TOP OF THE BODY ELEMENT...
},

error: function (jqXHR, textStatus, errorThrown) {
console.log('The following error occured: ' + textStatus, errorThrown);
},

complete: function (jqXHR, textStatus) {
console.log('The Request Round-Trip has successfully Completed... Happy Coding....');
}
});

});
})(jQuery);

</script>

Answer

Create 2 files in the same directory

file1.php

     <?php

    if(isset($_POST['height'])){
        $solo_height = $_POST['height'];

        if ($solo_height > 1){
            echo '<div class="view_full_post">View Full Post</div>';
        }else{
            echo "The Height is Less than a Thousand... What do we do sir???";
        }
    }
?>

index.php (with the html, body tag,etc)

.....
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
        <script>
        $(document).ready(function(e) {
            view_height = $("#view_height").height();
            $.ajax({
                type: "POST",
                url: "file1.php",  // POINTS TO THE PROCESSING FILE WE CREATED ABOVE
                data:{ height: view_height },
                success: function(data){
                    console.log(view_height); 
                    $('body').append('<h1>'+data+'</h1>');
                },              

                error: function (jqXHR, textStatus, errorThrown) {
                    console.log('The following error occured: ' + textStatus, errorThrown);
                },

                complete: function (jqXHR, textStatus) {
                    console.log('The Request Round-Trip has successfully Completed... Happy Coding....');                   
                }
            });

        });
        </script>
....