Home/ Questions/Q 6113429
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-23T14:51:29+00:00

I have this Star Rating system right. When you click on a star it

  • 0

I have this Star Rating system right. When you click on a star it should pass a value into the function. Then using AJAX it posts it to an external PHP file. The only problem is that when it gets to the PHP file it comes as null or no value.

I will try to echo the $_POST[‘vote’] variable in an alert box using AJAX and it is blank so it doesn’t come back as “NULL” or “0” it’s just nothing. I’m not sure where I’m losing the value because I can track it all the way to the send() function. Anyone see a problem?

HTML:

<style type="text/css">
    #container{margin: 10px auto;width: 500px;height: 300px;background-color: gray;}
    #starContainer{padding-top:20px;margin:0 auto;width:150px;}
    .box{height:28px;width:30px;float:left;position:relative;z-index:5;cursor:pointer;}
    .star{background-image:url('emptyStar.png');background-repeat:no-repeat;}
    .starHover{background-image:url('goldStar.png');background-repeat:no-repeat;}
    #voteBar{float:left;height:28px;background-color:#dbd923;position:relative;top:-28px;z-index:1;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.box').hover(
        // Handles the mouseover
        function() {
            $(this).prevAll().andSelf().addClass('starHover');
        },
        // Handles the mouseout
        function() {
            $(this).prevAll().andSelf().removeClass('starHover'); 
        }
    );
});

    function Cast(vote)
    {
        if(window.XMLHttpRequest)
        {
            xmlhttp = new XMLHttpRequest();
        }
        else
        {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange = function()
        {
            if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
            {
                alert(xmlhttp.responseText);
                var json = JSON.parse(xmlhttp.responseText);
            }
        }

        xmlhttp.open("POST", "process.php", true);
        xmlhttp.send('vote=' + vote);
    }
</script>

</head>
<body>

<div id="container">
    <center>
        <div id="starContainer">
            <div class="box star" onclick="Cast(1)"></div>
            <div class="box star" onclick="Cast(2)"></div>
            <div class="box star" onclick="Cast(3)"></div>
            <div class="box star" onclick="Cast(4)"></div>
            <div class="box star" onclick="Cast(5)"></div>
            <div id="voteBar"></div>
        </div>
    </center>
</div>

</body>
</html>

PHP:

<?php
$vote = $_POST['vote'];

$totalVoteValue = 0;
$amtVotes = 1;

$width = (($totalVoteValue + (($vote - $totalVoteValue) / $amtVotes)) / 5) * 150;

echo $width;
?>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
        xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')

    adding this may help (before send after open)

    • 0