I am using AJAX and PHP to create a post and display it right away. My php code works to create the post but im having trouble doing the json encode to display the post that was just created. Encoding the html like this seems to add a \ before every / causing the html to break and display in a weird way. (I am using a json encode because in the event of there being an error I need a variable to know if it was an error and display the error in a different place than then posts)
Here is what i am trying to encode
$data = "<article class='post'><div class='post-head cf'>
<a class='userpic' href=''><img src='$userpic' alt='".$rowuser['username']."'></a>
<a href='' class='username'>".$rowuser['username']."</a></div>
<img src='users/user_".$rowuser['user_id']."/posts/".$row['image']."' alt=''>
<div class='post-body'>
<div class='post-options'>
<a class='likes' href=''>156 likes</a>
</div>
<p><a class='username' href=''>".$rowuser['username']."</a>".$row['body']."</p>
<hr /><div class='cf'>
<a class='like hide-text' href='javascript:;'>Like This Post</a>
<form action='' class='ment'>
<input type='text' placeholder='Add a ment'></form></div>
</div></article>";
echo json_encode($data);
I am using AJAX and PHP to create a post and display it right away. My php code works to create the post but im having trouble doing the json encode to display the post that was just created. Encoding the html like this seems to add a \ before every / causing the html to break and display in a weird way. (I am using a json encode because in the event of there being an error I need a variable to know if it was an error and display the error in a different place than then posts)
Here is what i am trying to encode
$data = "<article class='post'><div class='post-head cf'>
<a class='userpic' href=''><img src='$userpic' alt='".$rowuser['username']."'></a>
<a href='' class='username'>".$rowuser['username']."</a></div>
<img src='users/user_".$rowuser['user_id']."/posts/".$row['image']."' alt=''>
<div class='post-body'>
<div class='post-options'>
<a class='likes' href=''>156 likes</a>
</div>
<p><a class='username' href=''>".$rowuser['username']."</a>".$row['body']."</p>
<hr /><div class='cf'>
<a class='like hide-text' href='javascript:;'>Like This Post</a>
<form action='' class='ment'>
<input type='text' placeholder='Add a ment'></form></div>
</div></article>";
echo json_encode($data);
- 1 Why JSON? Theres no reason not to use the html... – Jonas Wilms Commented Dec 27, 2016 at 17:51
- @Jonasw When creating the post there is alot of things that could go wrong when uploading the image, if that is the case I need to be able to display the error. In ajax I am prepending the response to the feed, but in case of there being an error I want the response to be appended to a different div for errors. In order to do this I have to use JSON to send a variable plus the response to check in ajax first if there was an error and then select where to display the response. Now if there is no errors ajax is already looking for a json object and if it doesnt receive it, it wont do anything – Alex K Commented Dec 27, 2016 at 17:58
2 Answers
Reset to default 9Encoding the html like this seems to add a \ before every / causing the html to break
PHP is escaping the slashes while encoding. This can be preventing by adding a JSON_UNESCAPED_SLASHES flag when calling json_encode():
$data = "<html></html>";
$escaped = json_encode($data);
// string(16) ""<html><\/html>""
var_dump($escaped);
$unescaped = json_encode($data, JSON_UNESCAPED_SLASHES);
// string(15) ""<html></html>""
var_dump($unescaped);
Wrap the error into a json as a string: response.php:
{
<?php If(someerror){ ?>
error:"<html>yourhtml</html>",
<?php } ?>
}
Now you can do:
$.ajax("response.php",function(data){
data=JSON.parse(data);
if(data.error){
$("#error").append(data.error);
return;
}
//work with the obj (data)
});