JavaScript

08. で DirectStore でのサーバー更新について調べましたが，それでは実際にサーバー側のルーチンはどう書いたらいいのでしょうか。ここでは，PHPとxFrameworkPXを使った場合を例示します。xFrameworkPXでは，ExtDirectコントローラーを使えば，モジュールのメソッドがそのままExtDirectで使えるという便利な機能があります。ここでは，そのモジュールのメソッドの記述例を示してExtDirectでのサーバー側の実装を示します。ただ，他のフレームワークを使った場合でも，API周りの処理に違いがあるとは思いますが，実際に処理するメソッド自体は大同小異だと思いますので，参考にはなると思います。

2010/03/25 更新 

DirectStore でサーバー側のデータを読むことができるのは知っていました。が，更新をかける方法がわからず，Storeの中の更新データを取り出すメソッドを読んで，そのデータをExt.Directの関数をコールすることでサーバー側に渡していました。

でも，ちゃんと設定すれば，DirectStore の save() メソッドをコールするだけで，サーバーに更新をかけることができます。

DirectStore／EditorGridPanel を使ってアプリケーションを作る時の基本的なことを書き留めておきたいと思います。サーバーサイドは，ｘFrameworkPX　を使います。 

Ext Designerの操作を学んでいて，結局マニュアルをちゃんと読むべきだという結論に達し，一念発起して英文のマニュアルを読みました。

 パネルの内容を動的にセットするには，Ext.Templateを使うのがExtJS流みたいです。

参考サイト

• ExtJS入門10　Ext.XTemplateを使う
• Ext.Templateの使い方

テンプレートとなるhtml文をセットしてテンプレートオブジェクトを生成。そのhtmlは，ページ中の要素からも取り出せるし，文字列で与えても良い。

Ext Designer で作成されるファイル

Ext Designerで，画面上にいろいろ配置してプロジェクトを保存した後に，「Export Project」を実行するとソースファイルが生成されます。ファイルは，トップレベルのコンポーネントごとにhogehoge.jsというファイルとhogehoge.ui.jsという二つのファイルというようになります。

またデータストアの場合はもデータストアごとに一つのファイルができます。

そのほかに，

http://www.sencha.com/http://www.sencha.com/

Spketの導入

 Javascriptの開発環境はspketがいいと聞いた。それを信じてspket導入する。

導入方法は「Javascript向けIDE「Spket IDE」の導入」を参照した。

この記事のとおり，spketのexe版を導入してみた。あとでpleiadesを入れて日本語化もでき，とても簡単に導入できた。

ExtJSでのコード補完の設定もしておく。参考にしたのは「Eclipse + Spket + ExtJS でコード補完をしてみる」。でもExtJSのバージョンがちょっと違うみたい。3.1.1の場合は，おそよ次のとおりの手順かな？

配置

extjsのライブラリをサーバーに配置。ここではルート直下のjsというフォルダにextというフォルダを作り，そこに必要なものを配置してみる。

ExtJS入門1　開発環境を整える | ExtJSで楽しくRIA業務アプリ開発

によると，docsとexamplesはいらないとのことなので，それを抜いて配置する。

書籍「ExtJS入門」では，ext-all.jsとext-base.jsそれとresoucesディレクトリがあればいいと書いてあるが，これはたぶんV2.1の場合でしょう。3.0以降だと，少なくともpkgsディレクトリは必要だと思う。

テンプレート？

ExtJSを利用するhtmlファイルのテンプレートを作っておくと便利かな。

Ext Japan

• Ext Japan - Ext JS / Ext GWTのライセンス・サポート・研修・コンサルティング
• 日本語フォーラムExt International
• Ext 3.0 - API Documentation 日本語版

ExtJSで楽しくRIA業務アプリ開発 (株式会社sus4)

• ExtJS入門1　開発環境を整える | ExtJSで楽しくRIA業務アプリ開発