How do I JSON Encode HTML in PHP?

Question

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='comment'>
         <input type='text' placeholder='Add a comment'></form></div>
         </div></article>";

echo json_encode($data);

@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, Dec 27 '16 at 17:58

score 9 · Accepted Answer · edited May 23 '17 at 11:53

9

Encoding 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);

edited May 23 '17 at 11:53

Community

1
1

answered Dec 27 '16 at 18:03

HPierce

7,249
7
33
49

Looks like this is working!!! However it is also spitting out the "" wrapping up the html for the variable :s anyway i can remove that? I know i could probably do it with jquery but would rather remove them before that – Alex K Dec 27 '16 at 18:09
If you chose to remove it, it wouldn't be valid JSON anymore, it'd just be a bunch of HTML. Surely, you would just `echo` the HTML without json_encoding it if you wanted that `echo $data` vs `echo json_encode($data, ...)`? – HPierce Dec 27 '16 at 18:14
Hmm ok i guess ill just use slice on jquery to remove them, thanks alot – Alex K Dec 27 '16 at 18:25

Jonas Wilms · Answer 2 · 2016-12-27T18:08:37.587

0

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)
   });

edited Dec 27 '16 at 18:08

answered Dec 27 '16 at 18:03

Jonas Wilms

132,000
20
149
151

How do I JSON Encode HTML in PHP?

2 Answers2