Why is my PHP echo returning a 0 in some places (yet working in others)?
Question
When a form submits, the AJAX code below replaces anything with id = levelreplace with the word in the char column titled level in the MYSQL database. (For reference, the word in this column is " Easy .")
<script type='text/javascript'>
$(document).ready(function () {
$('#form').on('submit', function(e) {
e.preventDefault();
$.ajax({
url : "test.php",
type: "POST",
data: $(this).serialize(),
success: function (data) {
$(".levelreplace").text(data.level);
},
});
});
});
</script>
I also have this bit of JQuery which is supposed to take a div with id = classadderpanel and append the class " Easy " (using the AJAX above).
<script type='text/javascript'>
$(document).ready(function () {
$('#classadderpanel').addClass('<?php echo "<span class='levelreplace'>" + $data['level'] + "</span>"; ?>');
});
</script>
However, instead of adding the class " Easy " it adds the class " 0 ". I know that there's nothing wrong with the AJAX returning the correct MYSQL data because, elsewhere, I have the code:
<?php echo "<span class='wordlevelreplace'>" .$data['WordLevel']."</span>"; ?>
...and that successfully echoes the word " Easy ."
I'm guessing this has something to do with either my quotes or my concatenation, but I've played around with every iteration that I can think of and the problem does not resolve.
Full code (only with components relevant to the problem):
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
//AJAX to replace everything with id = "levelreplace" with the word in MYSQL column "level"
<script type='text/javascript'>
$(document).ready(function () {
$('#form').on('submit', function(e) {
e.preventDefault();
$.ajax({
url : "test.php",
type: "POST",
data: $(this).serialize(),
success: function (data) {
$(".levelreplace").text(data.level);
},
});
});
});
</script>
//Code to add class equal to the word in column titled "level"
<script type='text/javascript'>
$(document).ready(function () {
$('#classadderpanel').addClass('<?php echo "<span class='levelreplace'>" + $data['level'] + "</span>"; ?>'); // Returns 0
});
</script>
</head>
// ECHO SHOWING THAT THE AJAX SOMETIMES RETURN THE WORD "EASY" IN THE COLUMN LEVEL...AND SOMETIMES IT DOESN'T
<?php
echo "<span class='levelreplace'>" .$data['level']."</span>"; //Returns Easy; This is how I want everything with class = "levelrelace" to get replaced
?>
// DIV THAT SHOULD HAVE THE CLASS ADDED
<div id="classadderpanel" style="background-color: orange;">
<form id ="form" class = "classtest" action="aplayground_classadderform.php" method="POST">
<input type="submit" >
</div>
</html>
2 answers
solution1
1 2017-06-30 20:17:21
You are using JS Syntax in your php on this line:
$('#classadderpanel').addClass('<?php echo "<span class='levelreplace'>" + $data['level'] + "</span>"; ?>');
It should be:
$('#classadderpanel').addClass('<?php echo "<span class='levelreplace'>" . $data['level'] . "</span>"; ?>');
solution2
0 2017-06-30 20:43:22
The string (produced by PHP) <span class='levelreplace'>Easy</span> just cannot be a valid class to add to the element $('#classadderpanel') .
This method expects a string, not an element.
I can't say where the zero comes from...
But I think you want to add a span to the div .
So just use .append() or .prepend() instead of .addClass() .
That probably is what you are looking for.
Or just add the span using PHP !
Because I don't know what can be the use to make it on client-side on document ready.
Why not just to this and forget about appending with jQuery?
<div id="classadderpanel" style="background-color: orange;"> <span class='levelreplace'><?php echo $data['level']; ?></span> <form id="form" class="classtest" action="aplayground_classadderform.php" method="POST"> <input type="submit"> </div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.