I'm a beginner with JavaScript, what I need to do is to show a div with an alert in case of a certain string in the results data after a JavaScript function has been executed.
Here's my code (I'm working with Parse PHP SDK):
comments.php
echo '
<h5>'.$topic.'</h5>
<div style="display:none;" id="anAlert" class="alert alert-danger">
<button type="button" class="close" data-dismiss="alert">×</button> <strong>Ouch!</strong>
You already upvoted this Topic!
</div>
<br>
';
Javascript code into comments.php:
// UPVOTE A TOPIC -------------------
function upvoteTopic() {
var topicID = "<?php echo $topicID ?>";
var votesNr = Number("<?php echo $votes ?>");
$.ajax({
url:"vote-topic.php?isUpvoted=true&topicID=" + topicID, // Call vote-topic.php
type: "GET",
success:function(data) {
var results = data
console.debug(results);
if (results !== 'You already upvoted this Topic') {
// Show updated votes
document.getElementById('votesTxt').innerHTML = votesNr;
// Change buttons style
$( "#upvoteTopicButt" ).removeClass( "btn-default" ).addClass( "btn-primary" );
$( "#downvoteTopicButt" ).removeClass( "btn-primary" ).addClass( "btn-default" );
} else {
document.getElementById("anAlert").style.display = 'block';
}
}});
}
vote-topic.php
// UPVOTE ------------------------------------------
if ($isUpvoted == "true") {
// CANNOT VOTE YOUR OWN TOPIC
if($userPointer->getObjectId() == $currUser->getObjectId()) {
echo 'You cannot vote your own Topic!';
// VOTE TOPIC
} else {
// Get votes array
$upvotedBy = $tObj->get('upvotedBy');
$downvotedBy = $tObj->get('downvotedBy');
// You already upvoted this Topic
if (in_array($userID, $upvotedBy)) {
echo 'You already upvoted this Topic'; // HERE'S THE LINE I NEED TO COMPARE IN THE IF STATEMENT OF MY JAVASCRIPT FUNCTION!
// UPVOTE TOPIC
} else {
array_push( $upvotedBy, $currUser->getObjectId() );
$downvotedBy = array_diff( $downvotedBy, array($currUser->getObjectId() ) );
// Increment votes
$tObj->increment("votes", 1);
$tObj->setArray('upvotedBy', $upvotedBy);
$tObj->setArray('downvotedBy', $downvotedBy);
$tObj->save();
// echo 'You upvoted this Topic!';
}
}
So, when I click the UPVOTE button, my Javascript function successfully calls the vote-topic.php script and performs the saving in there, it changes the style of the upvoteTopicButt and downvoteTopicButt buttons, but it doesn't display my anAlert div.
I've tried to launch an alert of results, and it actually shows this line:
You already upvoted this Topic
So that's why I've placed this IF statement into my Javascript function:
if (results !== 'You already upvoted this Topic') {
...
} else {
document.getElementById("anAlert").style.display = 'block';
}
In theory, when the results message is == You already upvoted this Topic, my function should show my anAlert div. But it doesn't.
What am I doing wrong?
elsestatement? Have you tried putting aconsolemessage there tot see if js reaches that part?