I have a div with some buttons in it. The buttons should only appear if a certain event has occurred. My web app allows users to log into rooms and vote on something. If user (let’s say, joe) logs into room 20A and user dan also logs in. If dan presses the create poll button on his page, a vote button should then appear on joes page. I’m using ajax as I haven’t been able to find a good example of jquery.
Here’s the ajax function
<script type="text/javascript">
function ajaxUpdateVotingButtons(){
var votingStatusRequest; // The variable that makes Ajax possible!
try{
// Opera 8.0+, Firefox, Safari
votingStatusRequest = new XMLHttpRequest();
} catch (e){
// Internet Explorer Browsers
try{
votingStatusRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try{
votingStatusRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e){
// Something went wrong
alert("Your browser doesn't seem to support ajax!");
return false;
}
}
}
// Create a function that will receive data sent from the server
votingStatusRequest.onreadystatechange = function(){
var voteMessage = document.getElementById('voting_buttons');
if(votingStatusRequest.readyState == 4)
{
voteMessage.innerHTML = votingStatusRequest.responseText;
}
}
votingStatusRequest.open("GET", "index.php?r=room/ShowVoteButtons", true);
votingStatusRequest.send(null);
}
</script>
The ajax function loads this div below with content from another file
<div id="voting_buttons">
<?php
$user = User::model()->find('username=?', array(Yii::app()->user->name));
$poll = Poll::model()->find('room_name=? AND in_session=?',array($user->room_name, 1));
if(isset($poll) && $poll->in_session == 1) // if a poll has been started
{
if($user->has_voted ==1)
{
echo CHtml::submitButton('Vote',array('disabled'=>'disabled'));
}
else
{
echo CHtml::submitButton('Vote', array('submit' => array('vote/Create')));
}
}
?>
</div>
the file used to to fill the above div
<?php
$user = User::model()->find('username=?', array(Yii::app()->user->name));
$poll = Poll::model()->find('room_name=? AND in_session=?',array($user->room_name, 1));
if(isset($poll) && $poll->in_session == 1) // if a poll has been started
{
if($user->has_voted ==1)
{
echo CHtml::submitButton('Vote',array('disabled'=>'disabled'));
}
else
{
echo CHtml::submitButton('Vote', array('submit' => array('vote/Create')));
}
}
?>
Yes it’s exactly the same logic, I realize this may be quite backward but given my level of experience with both php and javascript it’s all I’ve managed to find thus far. The ajax function above is called every 5 seconds via a setInterval I have (not shown here)
So the problem is that when a poll is started, using this condition to check for that
$poll = Poll::model()->find('room_name=? AND in_session=?',array($user->room_name, 1));
The div’s content is reloaded just fine, but the button will not work. I have to refresh the page manually in the browser in order for the button to work (call the vote/Create) action. Do I need to bind an event to the vote button via javascript after the div reload? Any idea what I’m missing?