Javascript utf8 encoding?

Question

I have the following ajax call. It can send the request and get the response as expected. But I can't seem to get it correctly displayed in li items.

$.ajax({
    url:  "{% url 'users:profile_page_tags_get' 'primary' %}",
    type: 'GET',
    dataType: "json",
    success: function(data) {
        for ( var an_option in data.pd_options ){
            $("#selectable").append( "<li class='ui-widget-content-item ui-selectee'>"+an_option[0]+"</li>" );
        }
    }
})

It does get displayed when

$(".try1").html(data.pd_options[2][1]);

The response is a JSON array. The characters are encoded in utf8 I believe.

{"pd_options": [[2, "\u5316\u5b66\u5de5\u7a0b"], [1, "\u5316\u5de5"], [3, "\u571f\u6728\u5de5\u7a0b"]]}

This is a valid way of encoding a character for a _String literal_ in _JavaScript_ `"\u5316\u5b66\u5de5\u7a0b"` is the same as `"化学工程"` — Paul S., Aug 14 '15 at 15:14
Javascript can be in many character encodings. JSON *must* be in UTF-8, UTF-16, or UTF-32 per [the JSON spec](https://tools.ietf.org/html/rfc7159#section-8.1), with UTF-8 recommended. As such, escaping characters with `\u` codes in JSON is unnecessary, but harmless. — TRiG, Aug 14 '15 at 15:17

Michał Perłakowski · Accepted Answer · 2015-08-14T15:18:32.697

1

You misunderstood for...in loop. In your case, an_option is not element of array, but an index, so you should try data.pd_options[an_option] to get this element.

Your code should be:

$.ajax({
    url:  "{% url 'users:profile_page_tags_get' 'primary' %}",
    type: 'GET',
    dataType: "json",
    success: function(data) {
        for ( var an_option in data.pd_options ){
            $("#selectable").append( "<li class='ui-widget-content-item ui-selectee'>"+data.pd_options[an_option][1]+"</li>" );
        }
    }
});

edited Aug 14 '15 at 15:18

answered Aug 14 '15 at 15:16

Michał Perłakowski

88,409
26
156
177

1

You shouldn't `for..in` over an _Array_ if you want it's indices anyway, use a normal `for` – Paul S. Aug 14 '15 at 15:17
@Gothdo See [Why is using `for…in` on arrays such a bad idea?](https://stackoverflow.com/q/500504/1048572) – Bergi Aug 14 '15 at 15:20
Thanks! I'm new to Javascript. But that seems kinda weird. – Brian Aug 14 '15 at 15:20
1

@Brian: Read the documentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in . It's only weird because you had false assumptions. – Felix Kling Aug 14 '15 at 15:21
@Brian In _JavaScript_ keep in mind _**if it's not a primitive, it's an Object**_ i.e. _Array_ is really a special kind of _Object_ rather than it's own structure as you may find in other languages. This means `for..in` is the _Object's_ `for..in`, not an _Array-specific_ `for..in`. As such, anything which would be included or excluded for this way of iterating over an _Object_ also applies to _Array_, so only use `for..in` when you want to iterate over _enumerable keys_, not simply _indicies_ – Paul S. Aug 14 '15 at 15:25
@Gothdo: What does this have to do with `undefined`? – Bergi Aug 16 '15 at 18:32
That's not the only thing against which using proper `for` loops instead of `for in` on arrays is guarding. – Bergi Aug 16 '15 at 19:33

Javascript utf8 encoding?

1 Answers1