マニュアルキャンセル

Dreamweaver でのレコードの更新ページの作成

検索

最終更新日 : 2021年4月28日

Dreamweaver

アプリを開く

注意：

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

レコード更新ページについて

ユーザーがデータベーステーブルの既存レコードを更新できるページを、アプリケーションに含めることができます。ページは通常、検索ページ、結果ページ、および更新ページで構成されます。検索および結果ページではレコードを取得し、更新ページではレコードを修正できます。

更新するレコードの検索

ユーザーがレコードを更新する場合、まずそのレコードをデータベースで検索する必要があります。そのために、更新ページと連動する検索および結果ページが必要となります。ユーザーは、検索ページに検索基準を入力し、結果ページ上のレコードを選択します。ユーザーが結果ページ上のレコードをクリックすると、更新ページが開き、選択したレコードが HTML フォーム内に表示されます。

更新ページへのリンクの作成

検索ページと結果ページを作成した後で、更新ページを開くためのリンクを結果ページ上に作成します。その後で、ユーザーが選択したレコードの ID を渡すようにリンクを修正します。更新ページでは、この ID を使用して、要求されたレコードをデータベース内で検索し、その結果を表示します。

更新ページを開いてレコード ID を渡す手順は、詳細ページを開いてレコード ID を渡す手順と同じです。詳しくは、詳細ページへのリンクの作成を参照してください。

更新するレコードの取得

結果ページから更新対象のレコードを指定するレコード ID が更新ページに渡されると、更新ページはそのパラメーターを読み取り、データベーステーブルから指定のレコードを取得し、一時的にそのレコードをレコードセットに格納します。

Dreamweaver でページを作成して保存します。

このページが更新ページになります。
バインディングパネル（ウィンドウ／バインディング）で、「+」ボタンをクリックして「レコードセット」を選択します。

詳細設定のダイアログボックスが表示された場合は、「基本設定」をクリックします。詳細設定のダイアログボックスには、SQL ステートメントを入力するためのテキスト領域があります。基本設定のダイアログボックスにはこのテキスト領域がありません。
レコードセットの名前を指定し、接続とテーブルポップアップメニューを使用して、更新するデータが存在する場所を指定します。
「選択」オプションをクリックし、キー列（通常、そのレコードの ID 列）と、更新するデータが含まれている列を選択します。
キー列の値が、結果ページから渡された対応する URL パラメーターの値と同じになるように、「フィルター」領域を設定します。

このフィルターにより、結果ページで指定したレコードだけを含むレコードセットが作成されます。例えば、キー列がレコード ID 情報を含む PRID という名前の列で、結果ページがこれに一致するレコード ID 情報を id という名前の URL パラメーターで渡す場合、「フィルター」領域は次のように表示されます。

フィルター領域
「OK」をクリックします。

ユーザーが結果ページのレコードを選択すると、更新ページでは、選択したレコードだけが含まれるレコードセットが生成されます。

ブロックごとの更新ページの作成

更新ページには、次の 3 つの作成ブロックが含まれます。

データベーステーブルからレコードを取得するためのフィルター済みレコードセット
ユーザーがレコードのデータを修正するための HTML フォーム
データベーステーブルを更新する「レコードの更新」サーバービヘイビアー
フォームツールとサーバービヘイビアーパネルを使用し、更新ページの最後の 2 つの基本作成ブロックを 1 つずつ追加することができます。

更新ページへの HTML フォームの追加

ファイル／新規／空白ページを選択してページを作成します。このページが更新ページになります。
Dreamweaver のデザインツールを使用してページをレイアウトします。
フォームを挿入する位置に挿入ポイントを置いて、挿入／フォーム／フォームを選択し、HTML フォームを追加します。

ページに空白のフォームが作成されます。フォームの境界線を表示するには、表示／ビジュアルエイド／不可視エレメントを選択する必要があります。フォームの境界線は細い赤線で表示されます。
HTML フォームの名前を指定します。ドキュメントウィンドウの下部にある <form> タグをクリックし、ウィンドウ／プロパティを選択してプロパティインスペクターを開き、「フォーム名」ボックスに名前を入力します。

フォームの action 属性や method 属性を指定して、ビジターが「送信」ボタンをクリックしたときのレコードの送信先や送信方法を指示する必要はありません。「レコードの更新」サーバービヘイビアーが自動的にこれらの属性を設定します。
データベーステーブル内のレコードを更新する列ごとに、テキストフィールド（挿入／フォーム／テキストフィールド）などのフォームオブジェクトを追加します。

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

各フォームオブジェクトに対し、レコードセット内の列がユーザーにより事前定義されています。唯一の例外は固有のキー列で、この列には対応するフォームオブジェクトがありません。
挿入／フォーム／ボタンを選択して、フォームに「送信」ボタンを追加します。

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

フォームへのレコードの表示

ユーザーが更新したいレコードを保持するレコードセットを定義してあるかを確認します。

詳しくは、更新するレコードの取得を参照してください。
次の項で説明しているように、各フォームオブジェクトをレコードセット内のデータにバインドします。

データベーステーブルを更新するサーバービヘイビアーの追加

サーバービヘイビアーパネル（ウィンドウ／サーバービヘイビアー）で「+」ボタンをクリックし、ポップアップメニューから「レコードの更新」を選択します。

レコードの更新ダイアログボックスが表示されます。
値送信元ポップアップメニューからフォームを選択します。
データソースまたは接続ポップアップメニューからデータベースへの接続を選択します。
該当する場合はユーザー名とパスワードを入力します。
更新するテーブルポップアップメニューから、更新するレコードを含むデータベーステーブルを選択します。
（ColdFusion、PHP）更新するデータベース列を指定し、値ポップアップメニューから列の更新元のフォームオブジェクトを選択し、このフォームオブジェクトのデータタイプを送信形式ポップアップメニューから選択します。この列をプライマリキーとして指定する場合は「プライマリキー」を選択します。

データタイプとは、データベーステーブルの列に入力できるデータの種類です。データタイプには、テキスト、数値、ブールオプション値があります。

フォーム内の各フォームオブジェクトについて、この操作を繰り返します。
（ASP）レコード選択元ポップアップメニューから、HTML フォームに表示するレコードが含まれているレコードセットを指定します。ユニークキー列ポップアップメニューから、データベーステーブルのレコードを特定するキー列（通常は、レコード ID 列）を選択します。値が数値の場合は、「数値」オプションを選択します。通常、キー列に入力できるのは数値だけですが、テキスト値を使用できる場合もあります。
テーブルのレコードを更新した後に開くページを、「更新後の移動先」または「成功時の移動先」ボックスに入力するか、または「参照」ボタンをクリックしてファイルを参照します。
（ASP）更新するデータベース列を指定し、値ポップアップメニューから列の更新元のフォームオブジェクトを選択してから、このフォームオブジェクトのデータタイプを送信形式ポップアップメニューから選択します。データタイプとは、データベーステーブルの列に入力できるデータの種類です。データタイプには、テキスト、数値、ブールオプション値があります。フォーム内の各フォームについて、この操作を繰り返します。
「OK」をクリックします。

Dreamweaver によってサーバービヘイビアーがページに追加されます。HTML フォームに表示されている情報を修正して「送信」ボタンをクリックすることで、ユーザーがデータベーステーブル内のレコードを更新できるようになります。

サーバービヘイビアーを編集するには、ウィンドウ／サーバービヘイビアーのコマンドメニューを選択してサーバービヘイビアーパネルを開き、「レコードの更新」ビヘイビアーをダブルクリックします。

1 回の操作による更新ページの作成

更新ページには、次の 3 つの作成ブロックが含まれます。

データベーステーブルからレコードを取得するためのフィルター済みレコードセット
ユーザーがレコードのデータを修正するための HTML フォーム
データベーステーブルを更新する「レコードの更新」サーバービヘイビアー

「レコード更新フォーム」データオブジェクトを使用すると、更新ページの最後の 2 つの作成ブロックを 1 回の操作で追加できます。このデータオブジェクトにより、HTML フォームと「レコードの更新」サーバービヘイビアーの両方が更新ページに追加されます。

まず Web アプリケーションが、更新するレコードを特定できるように設定し、さらに、更新ページでそのレコードを取得できるようにしてから、データオブジェクトを使用します。

データオブジェクトで作成ブロックをページに配置した後は、Dreamweaver のデザインツールを使用して、そのフォームを自由にカスタマイズすることも、サーバービヘイビアーパネルを使用して「レコードの更新」サーバービヘイビアーを編集することもできます。

注意：

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

デザインビューでページを開き、挿入／データオブジェクト／レコードの更新／レコード更新フォームウィザードを選択します。

レコード更新フォームダイアログボックスが表示されます。
接続ポップアップメニューからデータベースへの接続を選択します。

接続を定義する必要がある場合は、「定義」ボタンをクリックします。
更新対象テーブルポップアップメニューから、更新するレコードを含むデータベーステーブルを選択します。
レコード選択元ポップアップメニューから、HTML フォームに表示するレコードが含まれているレコードセットを指定します。
ユニークキー列ポップアップメニューから、データベーステーブルのレコードを特定するキー列（通常は、レコード ID 列）を選択します。

値が数値の場合は、「数値」オプションを選択します。通常、キー列に入力できるのは数値だけですが、テキスト値を使用できる場合もあります。
テーブルのレコードの更新後に開くページを、「更新後の移動先」テキストボックスに入力します。
「フォームフィールド」領域で、各フォームオブジェクトが更新するデータベーステーブル内の列を指定します。

初期設定では、Dreamweaver は、データベーステーブルの各列に対してフォームオブジェクトを 1 つずつ作成します。使用しているデータベースで、新規作成されたレコードに対して自動的に固有のキー ID が生成される場合は、そのキー列に対応するフォームオブジェクトをリストから選択し、「-」ボタンをクリックして削除してください。削除しておけば、フォームを使用するユーザーが既に存在している ID の値を入力してしまうことはありません。

リストからフォームオブジェクトを選択し、ダイアログボックスの右側にある上向きまたは下向きの矢印をクリックすると、HTML フォームのフォームオブジェクトの並び順を変更することができます。
「フォームフィールド」テーブルの行をクリックし、このテーブルの下のボックスに次の情報を入力して、HTML フォームでの各データエントリフィールドの表示方法を指定します。
- 「ラベル」ボックスに、データエントリフィールドの横に表示する説明ラベルを入力します。Dreamweaver では、初期設定のラベルとしてテーブル列の名前が表示されます。
- 表示形式ポップアップメニューから、データエントリフィールドとして使用するフォームオブジェクトを選択します。「テキストフィールド」、「テキストエリア」、「メニュー」、「チェックボックス」、「ラジオボタングループ」、「テキスト」から選択できます。読み取り専用エントリの場合は、「テキスト」を選択してください。また「パスワードフィールド」、「ファイルフィールド」、および「非表示フィールド」を選択することもできます。
注意：

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

メニューグループとラジオボタングループの場合は、別のダイアログボックスが開き、そこでプロパティを設定します。オプションの場合は、レコードの表示時にオプションをオンにするかどうかを決定できるように、オプションの現在のレコード値と指定値との比較を定義します。
「OK」をクリックします。

Dreamweaver によって、HTML フォームと「レコードの更新」サーバービヘイビアーの両方がページに自動的に追加されます。

このデータオブジェクトにより、HTML フォームと「レコードの更新」サーバービヘイビアーの両方がページに追加されます。フォームオブジェクトが基本テーブルに配置され、Dreamweaver のページデザインツールでカスタマイズできるようになります。フォームオブジェクト全体がフォームの境界内に収まるようにしてください。

サーバービヘイビアーを編集するには、ウィンドウ／サーバービヘイビアーのコマンドメニューを選択してサーバービヘイビアーパネルを開き、「レコードの更新」ビヘイビアーをダブルクリックします。

フォームエレメントプロパティダイアログボックスのオプション

フォームエレメントプロパティダイアログボックスでは、ユーザーがデータベース内のレコードを更新するための、ページ上のフォームエレメントのオプションを設定することができます。

フォームエレメントをどのように作成するかに応じて、「手動」または「データベースから」のいずれかを選択します。
「+」ボタンをクリックし、エレメントを追加します。
エレメントのラベルおよび値を入力します。
ページをブラウザーで開くとき、またはフォームにレコードを表示するときに、特定のエレメントが選択された状態で表示されるようにするには、そのエレメントの値と同じ値を「同等値の選択」ボックスに入力します。

固定値を入力できる他、稲妻アイコンをクリックしてデータソースのリストから動的な値を選択して動的な値を指定することもできます。いずれの場合も、指定する値はエレメントの値のいずれかと一致している必要があります。

その他の関連ヘルプ

Adobe

ヘルプをすばやく簡単に入手

新規ユーザーの場合

Adobe MAX Japan
クリエイターの祭典

2025 年 2 月 13 日
東京ビッグサイト

今すぐ登録