Jquery Json output special characters issue

Question

So I'm working on a system to get the metatag from a webpage to get the info for a video embed from a link (like facebook does).

I am also getting the title of the page and the description to prefill some fields. And here is where I have a problem, the description works fine because it is a textarea so i can use .html() but the title is an input so I can either use .attr() or .val() and the problem comes from special characters like (é à è ö ä ü).

Here is my code that I'm using.

This is my Jquery action script:

<script type="text/javascript" charset="utf-8">     
$(function(){
    $("#url").bind("change", function(){
        var url = $("#url").val();
        $.getJSON("/ajax/embed_video.php", { url: url }, function(json) {
            $(json.embed).appendTo("#feeds");
            $("#title").attr("value", json.title);
            $("#description").html(json.description);
         });
    });
});
</script>

This is my php file for exporting the JSON data :

$url = $_GET['url'];
$result = getUrlData($url); //this get the metadata from the url
$description = $result['metaTags']['og:description']['value'];
$title = $result['metaTags']['og:title']['value'];

$img_name = basename($result['metaTags']['og:image']['value']);
copy(''.$result['metaTags']['og:image']['value'].'', "../".$path_video_temp.$img_name);

$embed = " "; //EMBED CODE

$data = array('title' => $title,'description' => $description, 'embed' => $embed, 'img' => '/'.$path_video_temp.$img_name);

header('Content-Type: application/json; Charset=UTF-8');
echo json_encode($data);

When I have a title with any accent or any special character it prints out é etc.

I tried using html_entity_decode and htmlspecialchars_decode

I hope someone has an idea where is the problem.

Thanks for your time and have a good day

Joris

score 1 · Accepted Answer · edited May 23 '17 at 12:04

You could try using an Ajax request to retrieve your data as opposed to getjson in the Ajax request you can specify the character encoding of the data to be retrieved Here's a comparison of Ajax and getjson

http://api.jquery.com/jQuery.getJSON/

And here's how Ajax is set up

http://api.jquery.com/jQuery.ajax/

A note on this method is that json requests are not asynchronous so in the Ajax set async to false

---Edit---

Apologies setting the character set may only be used with jsonp are you able to use that instead ?

---Edit 2 ---

Could this forum post be helpful ?

How to decode HTML entities using jQuery?

Hope this helps !!

Thanks a lot, I used the code you linked to in your second edit and it works perfectly. Thanks for your time — Joris Blanc, May 18 '12 at 01:13

Jquery Json output special characters issue

1 Answers1