2008-07-01

FileMaker API for PHP を使ったアンケートフォーム作成 (3/4)

 サンプルデータベースと PHP ソースコードはこちらからダウンロードできます。(本アーカイブは、不定期に差し替えが行われる可能性があります。あらかじめご了承ください。)

 前回はアンケートページ操作の枠組みとなる、アンケート入力ページ、確認ページ、そしてお礼ページの切替方法について説明しました。いよいよ本格的なコード記述に入っていきます。PHP のコーディング規則については割愛しておりますので、不明な点があれば PHP のマニュアルを参照してください。

 皆さんご存じのとおり、Web ページの構成はざっと以下のようになっています。



 前回の説明では、本文部分の表示切替について説明したわけですが、実際は、本文を表示する前にヘッダを表示し、本文の表示が終わったところでフッタを表示することによって、Web ページを構成する必要があります。第一回目で、ヘッダとフッタは部品化できると申し上げたとおり、ヘッダとフッタをそれぞれ独立した文字列として変数にセットしておくことで、実際のページ表示を行うときに呼び出して使うことができます。
 以下はその部分を取り出したものですが、HTML による Web ページ作成経験がある方なら、この部分は容易に想像できるでしょう。

 ●ヘッダ部品のソース


ヘッダ中にある $pagetitle は、ページのタイトルを表示するための変数です。入力ページ、確認ページ、お礼ページでタイトルを切り替えることができるため、このようにしておくと便利です。

 ●フッタ部品のソース


 このように部品を用意しておけば、極端な話、PHP コードの中で以下のように記述するだけで一つの Web ページが出来上がります。


echo $header;
echo $footer;


 次に、上記のヘッダとフッタの間に入れる本文部分を検討していきます。

1. ステップ 0 (ユーザ入力ページ)

 ここでは、入力用のフォームを作っていきます。
 フォーム部品(エレメント)は次の 5 つです。

 氏名 -- テキストボックス (myname というエレメント名)
 email -- テキストボックス (email というエレメント名)
 アンケート回答 -- ラジオボタン (answer というエレメント名)
 その他回答 -- テキストボックス (otheranswer というエレメント名)
 ご意見など -- テキストエリア (memo というエレメント名)

 以下は上記を踏まえてフォームを起こすためのコードを PHP で記述したものです。



 上記赤で囲った部分がアンケート回答の選択肢を示すラジオボタンです。これですと、アンケート回答の選択肢が増えるたびにラジオボタン行を増やす必要があるため、将来的に非効率といえば非効率です。というわけで、このラジオボタンの部分を可変対応にしてみましょう。

 そこで選択肢のリスト作って変数に入れてみます。ここでは $answeroptions という変数にリストを配列としてセットしているところです。



 そして、ラジオボタンを表示したいところでこの変数($answeroptions)を呼び出して、各項目を取り出します。その加工を行っているのがこの部分です。



これでデフォルトのページの部品ができあがりました。しかし、これでは各エレメントの value が空欄のため、前回何らかのユーザ入力が行われていたとしても値はページには反映されません。そこで、前回ユーザ入力があった場合にはその値を当該の項目に表示する処理を追加します。
 この処理を施すと、次のようになります。赤線部分に注目してください。



 そしてさらに、必須項目である[氏名]欄と[email]欄が正しく入力されているかどうかをチェックして、値が不正の場合には赤字でメッセージを表示するようにします。
 その処理を施したものが以下のソースです。赤線部分に注目してください。



 入力項目の処理はこれで終わりですが、後は今のステップ番号を次の操作のためにどこかに用意しておく必要があります。
 ここでは以下のような隠しエレメントを用意して、そこにステップ番号を入れることにします。エレメントの名前は後で参照しやすいように page_flg としておきます。今回はステップ 0 (ユーザ入力フォーム)なので、設定しておく値は 0 ですね。



 後は送信ボタンとリセットボタンを用意するだけです。
 上記を踏まえて、もう一度サンプルコードを見てみてください。

2. ステップ 1 (確認ページ)
 このステップは、ステップ 0 に比べると比較的処理が容易です。ここでは、ステップ 0 で入力された値 ($_POST にまとめて入っています)を取り出してページに表示し、ユーザにこの内容でデータベースに送信しても良いか尋ねて、ステップ 2 に入力値を渡すだけです。

 まずは入力された値を表示します。この部分は、確認ページとお礼ページの両方で同じものを表示しますので、使い回すことができます。


 次に、ステップ 2 (お礼ページ)に渡すためのユーザ入力値を隠しエレメントとしてフォームに用意します。
 以下、赤線を引いた箇所が現在のステップ番号を渡しているところです。



 実際にサンプルコードのソースを開いてみて、この部分を確認してみてください。

 残すはステップ 2 です。ステップ 2 では、データベース操作およびメール送信について触れますので、次回詳しく説明いたします。

●まとめ
 入力フォームの記述方法とユーザ入力値の表示方法の理解

FileMaker API for PHP を使ったアンケートフォーム作成 (2/4)

 サンプルデータベースと PHP ソースコードはこちらからダウンロードできます。(本アーカイブは、不定期に差し替えが行われる可能性があります。あらかじめご了承ください。)

 さて、前回の説明ではアンケートページの流れと、流用可能部分の洗い出しを行いました。

 以降、PHP を使って話を進めていきますが、実際にコードを書く前に、まずは日本語で分岐処理を考えてみましょう。この作業がしっかりできれば、あとはそれを PHP の規則に従って置き換えるだけです。このやり方ならあらゆるプログラミング言語にも応用が利くので便利です。

 ページがロードされたときに、最初にしなければならないのは、このページが初回ロード(デフォルトページ)なのか、確認用ページなのか、それともお礼ページなのかを把握することです。そこで前回解説した 3 つのステップが登場するわけです。


 0 -- 初回ロード時(デフォルト)ユーザによるアンケート入力用ページ
 1 -- 確認ページ
2 -- お礼ページ

 ここで注目すべきことは、ユーザが正しい入力を行わなければ、いつまでたってもステップ 1 には進めないということです。今回のアンケートフォームでは、このために[氏名]欄と[email]欄を入力必須としています。この二つの項目正しい入力がなければ、誰が送ったのか後で判断できませんし、メールも送信できなくなってしまいます。また、ゴミデータを増やす原因にもなりますので、最低限[氏名]と[email]には入力をしてもらいたいところです。

 つまり、ステップ 0 ではユーザ入力ページを表示させつつ、正しい入力が行われているかどうかという判断も行います。

 ページがロードされた場合に、[氏名]欄と[email]欄に正しいデータ入力が行われていたときは、必要最低限の情報が揃ったことになりますので、ステップ 1 に進みます。

 さらにページがロードされた場合に、前回のユーザ操作で“確定”ボタンが押されていたことを確認できたときは、ステップ 2 に進んでデータを FileMaker データベースに書き込み、さらにメールを送信して終了します。

 実際にコード記述を行う際には、ステップにプログラム内で管理しやすい固有の名前を付けます。ここでは page_flg としてみます。page_flg が 0 ならステップ 0 というわけです。PHP では変数を取る場合は先頭に $ を付けますので $page_flg という名前になります。

 それではここまでを日本語で表現してみます。見やすさのために、各項目内はインデントを行います。ステップの名前は page_flg となっていますので、覚えておいてください。



   
 上記のように、ページがロードされた直後の処理が最も重要であることがわかりますね。page_flg の番号が特定できれば、あとはそれに応じたフォームを表示するだけです。
 さて、次はこれらの分岐を PHP に置き換えてみます。処理の詳細はまだ記述しませんので、コメント行として日本語で表します。先ほど申し上げたとおり、page_flg は PHP では $page_flg と記述します。



 分岐の方法や入力されたフォームの値($_POST に入っています)の説明は PHP のマニュアルをご覧いただくとして、こうして見てみると、処理の流れが意外と単純であることがわかりますね。ちなみに、Mailck()という名前の付いているものは、入力されたメールアドレスが適切な形式であるかどうかをチェックするために私が用意したユーザ定義関数の名前です。

 この枠組みができれば、あとはページヘッダ、フッタ、そしてフォームの詳細を追加していくだけです。
また、前回の説明にあったように、確認ページとお礼ページのコードは流用できる部分があるため、$page_flg の分岐を以下のように変更します。



 コードがさらにすっきりましたね。

 ここで、サンプルコードをダウンロードして、該当箇所を検索し、コードがどのようになっているかを調べてみてください。
 フォーム内容が記述されているため、PHP に不慣れな方には複雑に見えるとは思いますが、この枠組みが理解できていれば、今回のアンケートフォームの操作は 70% 理解できたと言っても過言ではないでしょう。

●まとめ
 ページ操作の枠組みとその記述方法(日本語、PHP)の理解

2008-06-30

FileMaker API for PHP を使ったアンケートフォーム作成 (1/4)

 本記事は2008年に FileMaker 9 の環境下で執筆されました。2016年11月現在、FileMaker の最新バージョンは 15 となっていますが、15 においても本記事の内容はなお有効と思われます。
 一方Ver 15 では WebDirect と呼ばれる 機能があり、これにより PHP などで Webプログラミングを行うことなく、 FileMaker デスクトップアプリとほぼ同様の操作がブラウザ上でも可能となります。WebDirect は開発が非常に楽になる半面、ライセンス費用やブラウザとの互換性等に問題があります。 したがって、高速開発性(RAD)を重視し、ブラウザ互換性をある程度無視できる環境では WebDirect は FileMaker API for PHP の代替となる可能性があります。

 参考: アンケートシステム・プロトタイプ


ブラウザとの互換性等に問題があります。 したがって、高速開発性(RAD)を重視し。ブラウザ互換性をある程度無視できる環境では WebDirect は FileMaker API for PHP の代替となる可能性があります。
 サンプルデータベースと PHP ソースコードはこちらからダウンロードできます。(本アーカイブは、不定期に差し替えが行われる可能性があります。あらかじめご了承ください。)
 さて、前回の投稿FileMaker Server 9 のインストールを終えましたので、これから数回にわたって FMS9 に装備されている FileMaker API for PHP を使うことによって FileMaker データベースにデータ書き込みを行う方法について説明します。
 ここでは最も手っ取り早く操作を理解することを目標に掲げていますが、今後は機会を見て同操作の Fx.php への展開、MySQL への展開、セッション管理などについても書いていきたいと思っております。

 FileMaker API for PHP は、PHP スクリプトから FileMaker データベースにアクセスすることによって、データベース操作を実現するクラスをまとめた API で、従来の CDML やインスタント Web 公開では機能的に限界のあったデータベース操作がさらに高度で柔軟なものになっています。
 操作にあたってはどうしても HTML と PHP を記述するための知識が必要になるわけですが、今回は理解の最短コースを目指し、最も単純な操作方法をコード付きで紹介します。

 サンプルデータベースと PHP ソースコードはこちらからダウンロードできます。(本アーカイブは、不定期に差し替えが行われる可能性があります。あらかじめご了承ください。)

 こんなページを想像してみましょう。

  1. アンケート入力ページが出てくる。

  2. 上記で正しい入力が行われると、確認ページが出てくる。

  3. 確定ボタンを押すと、入力されたデータが FileMaker データベースに書き込まれるとともに、その内容がメールで投稿者およびサーバ管理者に送信される。


 この動作を実現させたものがこちらのアンケート入力ページです。

入力→確認→データ書込(必要に応じてメール送信)、この三段構えを応用すると、商品申込ページや、住所録作成なども比較的簡単にできるようになります。

さて難しいことは抜きにして、まずは入力ページの部品を見てみましょう。



 ユーザ入力欄は以下の 5 つだけです。

  1. 氏名 -- 入力必須

  2. emailアドレス -- 入力必須

  3. アンケート回答 -- 選択必須。一番上の選択肢が最初に選択されている状態

  4. その他回答入力欄 -- 任意

  5. 要望など入力欄 -- 任意


 HTML による Web ページ作成経験のある方なら、ページ構成は容易に想像できるでしょう。
 PHP では、ある程度ページ部品を使いまわすことができますので、入力、確認、お礼のページで使いまわせそうな部分を抜き出していきます。

 ヘッダ --- 流用可能
 ボディ(本文) --- 一部流用可能
 フッタ --- 流用可能

 ボディが一部流用可能となっている理由は、入力ページではユーザ入力を許可し、確認ページとお礼のページではテキストのみが表示されるという理由で表示動作が異なるためです。それでも確認ページとお礼のページに表示させる内容は使い回せそうですね。

 それではこのアンケートページのブラウザ表示後のソースを見ながら流用できそうな部分にマークを付けてみます。



 図中の赤で囲んだ部分が入力、確認、お礼ページで共通している部分となりますので、PHP コードの中では一度記述すればよいことになります。

 次に、ページ動作の流れを決めます。

  1. 初回ページロード時は入力画面表示。

  2. 必須項目に正しく入力が行われたら、確認ページを表示

  3. 確認ページでユーザが“確定”ボタンを押したら、お礼のページを表示


ページの表示切替を容易に行うため、各ステップを 0 (デフォルト)、1 (確認)、2(お礼)のように決めます。つまり、ステップ 0 では、いくらページをロードしても入力画面が表示され、1 なら確認画面、2 ならお礼の画面という具合です。表示イメージは弊社サーバでテスト公開しているアンケート入力ページで確認していただくことにして、それぞれのステップのフォーム部分のコードを見てみましょう。

【ステップ 0 のソース】


【ステップ 1 のソース】


【ステップ 2 のソース】


ステップ 1 と ステップ 2 を比べてみてください。多少の差異は認められるものの、赤で囲んだ部分が殆んど同じであることがおわかりいただけるでしょう。ということで、この部分も PHP で使いまわすことができます。


●まとめ

  1. アンケート入力→確認→お礼ページの流れを把握

  2. 上記のそれそれのステップに 0, 1, 2 という番号を付ける

  3. ページのヘッダ、フッタ、本文で流用できそうな部分を洗い出す


流用できる部分の洗い出しは、設計段階でとても重要な作業となります。
次回より、上記を踏まえた上で、実際に php を使ってコーディングをしていきます。