レコード挿入ページの作成

最終更新日 : 2024年4月25日

Dreamweaver アプリケーションで、ユーザーがデータベースに新しいレコードを挿入することができるレコード挿入ページを作成する方法について説明します。

メモ

Dreamweaver 以降では、ユーザーインターフェイスが簡素化されています。 そのため、この記事で説明されているオプションの一部が Dreamweaver 以降には存在しない場合があります。 詳しくは、こちらの記事を参照してください。

レコード挿入ページについて

アプリケーションには、ユーザーがデータベースに新しいレコードを挿入できるページを含めることができます。

挿入ページは、次の 2 つの作成ブロックで構成されます。

  • ユーザーがデータを入力する HTML フォーム

  • データベースを更新する「レコードの挿入」サーバービヘイビアー

    ユーザーがフォーム上の「送信」ボタンをクリックしたときに、サーバービヘイビアーによってデータベーステーブルにレコードが挿入されます。

    「レコード挿入フォーム」データオブジェクトを使用してこれらの構成要素を一度の操作で追加することも、Dreamweaver フォームツールと「サーバービヘイビアー」パネルを使用して個別に追加することもできます。

メモ

挿入ページが保有できるレコード編集用のサーバービヘイビアーは、常に 1 つだけです。 例えば、挿入ページには「レコードの更新」や「レコードの削除」などのサーバービヘイビアーを追加できません。

ブロックごとの挿入ページの作成

フォームツールとサーバービヘイビアーを使用して挿入ページを作成することもできます。

挿入ページへの HTML フォームの追加

ダイナミックページを作成し(ファイル>新規>空白ページ)、Dreamweaver デザインツールを使用してページをレイアウトします。
フォームを表示させたい場所に挿入ポイントを配置し、挿入>フォーム>フォームを選択して HTML フォームを追加します。

ページに空白のフォームが作成されます。 フォームの境界を確認するために、Invisible Elements(View > Visual Aids > Invisible Elements)を有効にする必要がある場合があります。境界は細い赤い線で表示されます。

ドキュメントウィンドウの下部にある <form> タグをクリックしてフォームを選択し、プロパティインスペクター(ウィンドウ>プロパティ)を開いて、フォーム名ボックスに名前を入力して HTML フォームに名前を付けます。

ユーザーが送信ボタンをクリックしたときにレコードデータをどこにどのように送信するかをフォームに伝える action または method 属性を指定する必要はありません。Insert Record サーバービヘイビアーがこれらの属性を設定します。

レコードを挿入するデータベーステーブルの各列に対して、テキストフィールド(挿入>フォーム>テキストフィールド)などのフォームオブジェクトを追加します。

フォームオブジェクトはデータエントリ用です。 この目的にはテキストフィールドが一般的ですが、メニュー、オプション、ラジオボタンも使用できます。

フォームに送信ボタンを追加します(挿入>フォーム>ボタン)。

ボタンを選択し、プロパティインスペクター(ウィンドウ>プロパティ)を開いて、ラベルボックスに新しい値を入力することで、送信ボタンのラベルを変更できます。

データベーステーブルにレコードを挿入するサーバービヘイビアーを追加する(ColdFusion)

サーバービヘイビアーパネル(ウィンドウ>サーバービヘイビアー)で、プラス(+)ボタンをクリックし、ポップアップメニューから Insert Record を選択します。
値送信元ポップアップメニューからフォームを選択します。
データソースポップアップメニューで、データベースへの接続を選択します。
ユーザー名とパスワードを入力します。
Insert Into Table ポップアップメニューで、レコードを挿入するデータベーステーブルを選択します。
レコードを挿入するデータベース列を指定し、値ポップアップメニューからレコードを挿入するフォームオブジェクトを選択してから、Submit As ポップアップメニューからフォームオブジェクトのデータタイプを選択します。

データタイプは、データベーステーブルの列が期待するデータの種類です(テキスト、数値、ブーリアンオプション値)。

フォーム内の各フォームオブジェクトに対してこの手順を繰り返します。

「After Inserting, Go To」ボックスに、テーブルにレコードが挿入された後に開くページを入力するか、「参照」ボタンをクリックしてファイルを参照します。
「OK」をクリックします。

Dreamweaver は、ユーザーが HTML フォームに入力して送信ボタンをクリックすることで、データベーステーブルにレコードを挿入できるサーバービヘイビアーをページに追加します。

データベーステーブルにレコードを挿入するサーバービヘイビアーを追加する(ASP)

サーバービヘイビアーパネル(ウィンドウ>サーバービヘイビアー)で、プラス(+)ボタンをクリックし、ポップアップメニューから「Insert Record」を選択します。
接続ポップアップメニューで、データベースへの接続を選択します。

接続を定義する必要がある場合は、「定義」ボタンをクリックします。

「Insert Into Table」ポップアップメニューで、レコードを挿入するデータベーステーブルを選択します。
「After Inserting, Go To」ボックスで、レコードがテーブルに挿入された後に開くページを入力するか、「参照」をクリックしてファイルを参照します。
「Get Values From」ポップアップメニューで、データの入力に使用するHTML フォームを選択します。

Dreamweaver はページの最初のフォームを自動的に選択します。

レコードを挿入するデータベース列を指定し、「値」ポップアップメニューからレコードを挿入するフォームオブジェクトを選択してから、「Submit As」ポップアップメニューからフォームオブジェクトのデータタイプを選択します。

データタイプは、データベーステーブルの列が期待するデータの種類です(テキスト、数値、ブーリアンオプション値)。

フォーム内の各フォームオブジェクトについて手順を繰り返します。

「OK」をクリックします。

Dreamweaver はページにサーバービヘイビアを追加し、ユーザーがHTML フォームに入力してSubmitボタンをクリックすることで、データベーステーブルにレコードを挿入できるようになります。

サーバービヘイビアを編集するには、Server Behaviorsパネル(ウィンドウ > Server Behaviors)を開き、Insert Recordビヘイビアをダブルクリックします。

データベーステーブルにレコードを挿入するサーバービヘイビアを追加する(PHP)

Server Behaviorsパネル(ウィンドウ > Server Behaviors)で、プラス(+)ボタンをクリックし、ポップアップメニューから「Insert Record」を選択します。
値送信元ポップアップメニューからフォームを選択します。
「接続」ポップアップメニューで、データベースへの接続を選択します。
「Insert Table」ポップアップメニューで、レコードを挿入するデータベーステーブルを選択します。
レコードを挿入するデータベース列を指定し、「値」ポップアップメニューからレコードを挿入するフォームオブジェクトを選択し、「Submit As」ポップアップメニューからフォームオブジェクトのデータタイプを選択します。

データタイプは、データベーステーブルの列が期待するデータの種類です(テキスト、数値、ブーリアンオプション値)。

フォーム内の各フォームオブジェクトについて手順を繰り返します。

「After Inserting, Go To」ボックスで、レコードがテーブルに挿入された後に開くページを入力するか、「を参照」ボタンをクリックしてファイルをを参照します。
「OK」をクリックします。

Dreamweaver はページにサーバービヘイビアを追加し、ユーザーがHTML フォームに入力してSubmitボタンをクリックすることで、データベーステーブルにレコードを挿入できるようになります。

1 回の操作による挿入ページの作成

デザインビューでページを開き、「挿入」>「データオブジェクト」>「Insert Record」>「Record Insertion Form Wizard」を選択します。
[Connection]ポップアップメニューで、データベースへの接続を選択します。接続を定義する必要がある場合は、「定義」ボタンをクリックします。
「Insert Into Table」ポップアップメニューで、レコードを挿入するデータベーステーブルを選択します。
ColdFusion を使用する場合は、ユーザー名とパスワードを入力します。
「After Inserting, Go To」ボックスで、レコードがテーブルに挿入された後に開くページを入力するか、「を参照」ボタンをクリックしてファイルをを参照します。
「Form Fields」エリアで、挿入ページのHTML フォームに含めるフォームオブジェクト、およびデータベーステーブルの各列について各フォームオブジェクトが更新すべき列を指定します。

デフォルトでは、Dreamweaver はデータベーステーブルの各列に対してフォームオブジェクトを作成します。データベースが作成される新しいレコードごとに一意のキーIDを自動的に生成する場合、リストで選択してマイナス(-)ボタンをクリックすることで、キー列に対応するフォームオブジェクトを削除します。これにより、フォームのユーザーが既に存在するID値を入力するリスクがなくなります。

また、リスト内のフォームオブジェクトを選択し、ダイアログボックスの右側にある上向きまたは下向き矢印をクリックして、HTML フォーム上のフォームオブジェクトの順序を変更することもできます。

「フォームフィールド」テーブルの行をクリックし、テーブル下のボックスに次の情報を入力して、各データ入力フィールドをHTML フォームでどのように表示するかを指定します:
  • 「ラベル」ボックスに、データエントリフィールドの横に表示する説明ラベルを入力します。 デフォルトでは、Dreamweaverはテーブル列の名前をラベルに表示します。

  • 表示形式ポップアップメニューから、データエントリフィールドとして使用するフォームオブジェクトを選択します。 「テキストフィールド」、「テキストエリア」、「メニュー」、「チェックボックス」、「ラジオボタングループ」、「テキスト」から選択できます。 読み取り専用エントリの場合は、「テキスト」を選択してください。 また「パスワードフィールド」、「ファイルフィールド」、および「非表示フィールド」を選択することもできます。

メモ

非表示フィールドは、フォームの末尾に挿入されます。

  • 送信形式ポップアップメニューから、データベーステーブルで受信する際のデータ形式を選択します。 例えば、数値データのみを表示するテーブル列の場合は、「数値」を選択します。
  • フォームオブジェクトのプロパティを設定します。 オプションは、データエントリフィールドとして選択したフォームオブジェクトによって異なります。 テキストフィールド、テキスト領域、およびテキストの場合は、初期値を入力できます。 メニューグループとラジオボタングループの場合は、別のダイアログボックスが開き、そこでプロパティを設定します。 オプションの場合は「チェック済み」または「未チェック」を選択します。  
「OK」をクリックします。

DreamweaverはHTML フォームと「レコード挿入」サーバービヘイビアの両方をページに追加します。フォームオブジェクトは基本的なテーブルにレイアウトされており、Dreamweaverページデザインツールを使用してカスタマイズできます。(すべてのフォームオブジェクトがフォームの境界内に収まっていることを確認してください。)

サーバービヘイビアを編集するには、サーバービヘイビアパネル(ウィンドウ>サーバービヘイビア)を開き、「レコード挿入」ビヘイビアをダブルクリックします。

その他の関連ヘルプ