現在運用しているウェブアプリケーションの入力インターフェースを改善したいと思い、Wijimoを利用してみることにしました。まだ、ほんの少し触っただけなのですが、もう少し評価を進めていきたいと思います。
そもそもなぜWijimo？
私はこれまでは DHTMLX というロシア製のJSライブラリを利用してきました。このライブラリはGridがとても扱いやすく、データと画面を切り離して考えやすいという特徴があったことと、安かったため重宝していました。
JavaScript UI Library, Ajax Components & HTML5 Framework - DHTMLX
ところが、実際に作ったアプリケーションではやはりWindowsアプリケーションなどに比べて入力系の画面操作がやりづらいという指摘がありどうにか改善できないかとたどり着いたのがWijimoでした。もともと.NET系の開発をしていたためGrapecityのライブラリはこれまでも利用したことがあり、興味が引かれたのも事実です。
Twitter Bootstrap3とうまく利用できる？
まだカレンダーコントロールを少し利用した程度なので、正直わかりませんが思ったほど簡単にはいきませんでした。（もちろん、やり方が悪いだけかもしれませんが…）
どのへんが一手間かかったかというと、inputタグにドロップダウンカレンダーを設定したところ Bootstrap のCSSが反映されない状況になってしまいました。
[caption id="attachment_753" align="alignnone" width="300"]
Wijimoのドロップダウンカレンダーを適用する前の状態[/caption]
このようにTwitterBootstrapらしい感じの表示となっているのですが、以下のようになってしまいました。
[caption id="attachment_754" align="alignnone" width="300"]
wijimoを適用したとき[/caption]
支払日として設定していたコントロールがいまいちな感じになってしまっています。また、トグルボタンをクリックして表示されるカレンダーも背景が未設定なためかカレンダーとしてはだめだめな感じです。
とまぁ、何もしないで単純に適用した場合にはこんな感じになってしまうのですが、CSSを適用してあげることできれいになります。
[caption id="attachment_755" align="alignnone" width="300"]
CSSを適用してみたところ[/caption]
CSSの適用方法
CSSの適用方法ですが、以下の通りwijimoが生成するタグへ必要なクラスを追加するような対応を行っています。ひょっとしたらモードやテーマのような適用方法があるのかもしれませんが、Bootstrapに関してドキュメントを読む限りは特にありませんでした。（ご存じの方は教えてくださいませ！）
[javascript] $('#calendarDiv').addClass('panel panel-default'); $('.wijmo-wijinput-wrapper').addClass('form-control'); [/javascript]
今後について
とりあえず、まだ利用するかどうか決めかねていたのですが思ったよりもソースコードもすっきりしているしやりたいことも実現できるためこのまま購入して利用してみようかと思い始めています。（Gridとかも使い勝手を確認してからかと思っていますが、、、）
2015/1/4 追記
Gridについて試してみたのですが、残念ながらGrid内のセルにカレンダーやコンボボックスを表示することができないようです。（すくなくともドキュメントには記載がなかった…。）
これまで利用していたDHTMLXではグリッドにコンボボックスやカレンダーを表示することができていたのでかなり重宝していました。残念ながら今回は利用は見送ることにします。
