Ext JS4.2のform部品にapplyToがない件
今までは院内Webシステムを作るときは、見た目の良さからExt JS3.4を利用していたが、
新しいシステムを作るにあたって新しいバージョンの4.2を使ってみることにした。
Webシステムは、SeasarプロジェクトのSAStrutsとS2Daoを使っている。これすごい便利。
Javaで作るなら、これがないともう無理。私アンチPHPですし。自分だけでやるならこれ一択
まあそれはいいとして、Ext JS3.4のときはJSPに書いたhtml:textとかhtml:selectとかのタグに、
こんな感じでExt JSのスタイルを当てていた。
new Ext.form.DatePicker({ applyTo: "inputタグのid" });
Ext JS4使ってみると、applyToのコンフィグがない！！
コンボボックスだけはtransformのコンフィグでできたけど、日付選択とか、
ただのテキストボックスとかをExt JSスタイルにする方法が見当たらなかった。
うーん、サンプルみたいにExt JSだけでフォームの入力部品を作っていくと
アクションフォームの値をフォームに反映するのがひじょーに面倒だ。
JSPファイルの中でExt JSのフォームを作るjavascriptを書けばいいんだろうけど、それはしたくない。
他の人はどうしているんだろか？と思ってググってみたが、日本語の情報は皆無だった。
Ext JSって、そもそもどういう使い方を想定しているのか全然わからん。
PHPファイルとかJSPファイルにはinputタグを書かないのがセオリーなの？グリッドはすごい便利なのにその辺が優しくないなー
まあ、外国には同じことで困っている人がいたようで。
これを参考してみた。
http://www.sencha.com/forum/showthread.php?158065-add-applyTo-to-Ext-4.1&langid=14
/** * An abstract base class which provides shared methods for Components across the Sencha product line. * * Please refer to sub class's documentation. * @private */ Ext.define('Ext.AbstractComponent', { /* Begin Definitions */ // --------- 省略 ------------------ me.loader = me.getLoader(); // ここから if(me.applyTo) { me.name = me.applyTo; var elem = Ext.get(me.applyTo); me.setValue(elem.getValue()); me.setReadOnly(elem.dom.readOnly); me.setDisabled(elem.dom.disable); me.render(elem.dom.parentNode); var id = elem.id; elem.dom.parentNode.removeChild(elem.dom); me.inputEl.dom.setAttribute("id", id); }else // ここまで if (me.renderTo) { me.render(me.renderTo); // EXTJSIV-1935 - should be a way to do afterShow or something, but that // won't work. Likewise, rendering hidden and then showing (w/autoShow) has // implications to afterRender so we cannot do that. }
これで、Strutsタグで書いたフォームにExt JSスタイルを当てることができた
Ext.create("Ext.form.field.Date", { applyTo: "inputタグのid" });
