KnockoutJS

KnockoutJS is a javascript library which I started using just recently. I really like it, it is VERY powerful. I recently stumbled upon an annoying bug though that took me several hours to figure out. I got a message saying:


SCRIPT5022: Unable to parse bindings.
Message: SyntaxError: Expected identifier, string or number;
Bindings value: attr: { class: availability_class }
knockout-2.0.0.debug.js, line 1718 character 17

When running the code in IE7, IE8 and some older versions of Opera and Firefox. The html for this looks like:


<td data-bind="attr: { class: availability_class }">
<div style="text-align: center; font-size: 48px; line-height: 0;">&bull;</div>
</td>

And I couldn’t see anything wrong with it, but just for fun I tried adding quotes around "class", like so:


<td data-bind="attr: { 'class': availability_class }">
<div style="text-align: center; font-size: 48px; line-height: 0;">&bull;</div>
</td>

And it worked! So just in case someone else runs into the same problem, there you go. The knockout documentation says that adding quotes is necessary if the attribute name is a non-legal javscript name, for example "data-attribute" (containing a dash), but older browser seems to struggle even without the dash. So remember to add quotes just in case!

 
Warning: count(): Parameter must be an array or an object that implements Countable in /customers/8/5/a/martinpersson.org/httpd.www/wordpress/wp-includes/class-wp-comment-query.php on line 405

2 Responses to “KnockoutJS”

  1. Big thanks! I just want into the same problem with trying to use an attribute data-x and the quotes were what I needed.

  2. Jamie Hutber says:

    Thanks very much 🙂 worked like a charm and saved me even having to research this myself.

Leave a Reply