ラベル JavaScript の投稿を表示しています。 すべての投稿を表示
ラベル JavaScript の投稿を表示しています。 すべての投稿を表示

2013-01-16

FileMaker IWP (インスタントWeb公開) 上で JavaScript を使い、ページのリロードと印刷を行う方法

 FileMaker Pro/FileMaker Pro Advanced, FileMaker Server Advanced で インスタントWeb公開(Instant Web Publishing, 本記事では IWP で統一)を行うと、FileMaker Pro で開発したレイアウトをそのまま Web に公開してデータベースの更新や照会ができるようになります。

 現行で最新バージョンとなっている FileMaker 12 では、FileMaker Pro/FileMaker Pro Advanced の場合は、最大 5 ユーザまで Web での同時使用が可能となっており、これに対し、FileMaker Server Advanced の場合は最大 100 ユーザまで Web での同時使用が可能です。


 ただし、FileMaker Pro 本体に比べると、IWP には仕様上の制限があるため、開発時にそれらの制限を十分に考慮する必要があります。

 IWP でできないことは以下のとおりです。
  1. オブジェクトフィールドへのファイルのアップロード
  2. データのインポート/エクスポート
  3. FileMaker Pro のデータから PDF ファイルや Excel ファイルを作成
  4. FileMaker Pro のレポート閲覧
  5. レイアウト、レポート、スクリプト作成
  6. 警告音、メッセージポップアップ表示
  7. 印刷コマンド実行
 また、この他にもスクリプトトリガ、スクリプトステップ、条件付き書式などでも IWP に対応していない動作がありますので、FileMaker Pro 本体と IWP を併用する形でデータベースを運用する場合は、FileMaker Pro 側と Web 側での動作の違いに気を付けながら開発を進める必要があります。


 さて、今回は、上記に示した IWP の仕様制限のうち、1. オブジェクトフィールドへのファイルのアップロード、および 7. 印刷コマンド実行について対応方針を考えてみることにします。


【オブジェクトフィールドへのファイルのアップロード】

 オブジェクトフィールドそのものへファイルをアップロードする代わりに、php を使って Web サーバ上にファイルをアップロードし、そのファイルへのリンクを FX.php を使って FileMaker Pro データベースに書き込みます。

 FileMaker Pro 側の設定は、レイアウト上に以下のような Web ビューアを配置し、アップロード処理および FX.php 書込み操作を記述した php ファイルを指定します。



 php ファイルは Web サーバ上に配置してください。また、[Web ビューア内容とのインタラクションを許可] チェックボックスには必ずチェックを入れておきます。

 そのあと、IWP でデータベースを開くと、たとえば以下のようなページが表示されます。


 イメージとしては、ファイルアップロード後は、矢印が示すフィールド [FileURL] にそのファイルへのリンクを表示させるようにしたいわけですが、FX,php はバックグランドで操作されますので、ここは動的には変化しません。

 これを、JavaScript コマンドをページアップロード後に呼び出されるように組むことで、ページをリロードさせて反映させようというわけです。

 画面上に、「この部分が Parent」と表記しておりますが、Web ビューア(ピンク色)を自分自身とした場合、外のエリア(紫)が親 (parent) となりますので、JavaScript では parent に向けて処理をするようにします。



 parent.location.reload();


リロード後のイメージ



 FX.php を使った FileMaker Pro データベースへのデータ書込の話題は、以下の記事群をご覧ください。

【印刷コマンド実行】

 FileMaker Pro の印刷コマンドは、IWP では実行できません。
これでは、顧客一覧、見積書、請求書などの帳票を IWP で印刷したいときに不具合があります。

 この対策として、上記のファイルアップロード例と同じ要領で Web ビューアを配置し、印刷ボタンを配置したページを指定します。





 ファイルには、フォームの 印刷ボタンをクリックすると、JavaScript で以下のような関数を呼び出し、 parent ページを印刷するようにします。



function reportprint()
{
parent.focus();
parent.print();

}



 これにより、Web ブラウザの印刷ダイアログが表示されます。



 上図のように、印刷ボタンの部分もページとして印刷されてしまいますので、Web ビューアを配置する場所は 2 ページ目の先頭あたりにくるようにし、印刷時は 1 ページ目を選択するようにすると都合が良いでしょう。

以上

(亀澤)



【IWP関連記事】

【弊社のIWP関連製品・サービス】