IE8 與 Knockout js

客戶抱怨網頁呈現不正確。資料出不來。

看了一下，客戶使用的是 IE8 on Windows 7。天啊！算很新的系統，但就是不肯更新 IE 版本。

問題在 Knockoutjs

我用IE 10 按F12 開發者工具，檢查一下錯誤的 javascript

SCRIPT5022: Unable to parse bindings.
Message: SyntaxError: Expected identifier, string or number;
Bindings value: text: CompanyName, attr: { for: 'c' + TaxNo()}

binding 的 html 如下

<label data-bind="attr:{for: 'r' + ReportHeaderId()}, text: ReportName"></label>

原因

舊版本IE 會將 for: 當成 javascript 的保留字，想把它當成 javascript 來跑，因而錯誤。

解法

加上單引號，變成字串即可

<label data-bind="attr:{'for': 'r' + ReportHeaderId()}, text: ReportName"></label>

[Knockout] 解決 radio checked binding，radio button 老是要按兩次才能選取的的問題

這次問題的過程比較難以描述。

初始問題

問題 sample 如下

http://jsfiddle.net/CharlesLin/X2a5P/

當點選 radio button 時，一開始會點不順利，直到每點過一次以才會正常.

checked 只能 binding 到  string

查詢http://knockoutjs.com/documentation/checked-binding.html 中有提到下面這一段敘述

•For radio buttons, KO will set the element to be checked if and only if the parameter value equals the radio button node’s value attribute. So, your parameter value should be a string

意思是：當使用 checked 繫結時，必須是 string 才有用.

所以，就有了第二個版本：把 Id 改成 string

http://jsfiddle.net/CharlesLin/X2a5P/3/

這樣子就正常了.

我的解法

然而，將 Id 改型別是不合常理的。通常這些資料都是從伺服器端來的，並非我們能控制。最好在 client 能夠正常運作。
最後，只能修改 binding

http://jsfiddle.net/CharlesLin/X2a5P/4/

將 value 改成字串。改正 one-way binding 不影響此處值的顯示。

如此就符合我的需求了

Knockout.js

這是一個關於 Knockout.js 的 sample code 及 投影片。

個人對於 knockout.js 的未來潛力相當看好，是一個可以與 jQuery 爭輝的 JavaScript Library。

Sample Code 及投影片可以到這裡下載。