Javascript encoding

We encode our polls in UTF8 so all sites will be able to render them. But there was an issue with our polls at one stage, when the poll dynamically loaded content into the site, like after a vote, the text in the poll would render all screwed up.

For people unfamiliar with how widgets work, I’ll briefly explain. We give you an embed code (javascript) that you will place in your site HTML (where you want to display the widget). When this page loads, the javascript is enabled and calls a URL from our site to retrieve HTML. The code then places this HTML into a div container in your sites HTML using the DOM and innerHTML. Hey presto, the widget is rendered into your site.

The encoding problem occurred due to a site using another character encoding type other than UTF8. The HTML we send is encoded in UTF8 and the first time the poll widget loaded, it renders and looks fine. But it appeared that after a vote, so another request for HTML, the HTML seemed to adopt the sites encoding, causing the text in the poll to look a mess.

This bugged the hell out of us and like all the best solutions it was a simple one. You simply need to add a charset attribute to the script tag that references or encloses your javascript code.

So something like…

<script type="text/javascript" language="javascript" charset="utf-8" src="http://static.polldaddy.com/p/2064343.js"></script>

Here’s a decent description of the problem.