SharePoint Designer でデータ フォームを作成する

SharePoint Designer 2010 では、ビジネス データ ソースのデータを操作するためのフォームを作成し、高度にカスタマイズすることができます。フォームは、SharePoint サイトでユーザーからデータを収集するための重要な手段です。フォームを作成するには、最初にサイトのいずれかのページにデータ ビューを追加し、次にデータ ソースの各フィールドをフォームとして挿入します。ユーザーは、逆にフォームを通じてブラウザーからデータ ソースにデータを書き戻すことができます。

フォームは、データベース接続、XML ドキュメント、SharePoint リストやライブラリなど、いくつかのデータ ソースに対して作成できます。

この記事では、フォームの概要と SharePoint Designer 2010 でフォームを作成するさまざまな方法について説明します。

この記事の内容

フォームについて

リボンを使用してフォームを挿入する

[データ ソースの詳細] ウィンドウを使用してフォームを挿入する

次の手順

フォームについて

フォームは、SharePoint Designer 2010 のデータ ビュー機能に基づいています。最初にデータ ビューを理解すると、フォームを理解しやすくなります。データ ビューは、データ ソースのカスタマイズ可能なビューです。データ ビューは、ビュー形式またはフォーム形式で ASPX ページに挿入できます。ビュー形式で挿入すると、データのプレゼンテーションを書式設定できます。フォーム形式で挿入すると、データをブラウザーを通じて編集し、変更内容を元のデータ ソースに書き戻して保存することができます。

フォーム形式で挿入するデータ ビューは、SharePoint リストやライブラリ、データベース接続、およびローカル XML ドキュメントに対して作成できます。ただし、SOAP や REST の Web サービス接続には使用できません。フォーム自体は常に編集モードになります。フォームに表示される 1 つまたは複数のレコードに対して、ユーザーはブラウザーを通じて新しいレコードを追加したり、既存のレコードを変更したりできます。ただし、レコードを削除することはできません。

データ ビューを挿入すると、SharePoint Designer 2010 ではデータ ソースのデータを拡張マークアップ言語 (XML) 形式で取得し、取得したデータを Extensible Stylesheet Language Transformations (XSLT) を使用して表示します。ページにフォームを挿入すると、SharePoint Designer 2010 のデータ ビュー編集ツールを使用して、列の追加や削除、フィールドのフィルター、並べ替え、グループ化などができます。また、WYSIWYG ツールを使用してフォント プロパティ、画像、コントロール、およびフォームのレイアウト全体を変更できます。

これらのツールを使用すると、SharePoint Designer 2010 によって必要な XSLT がページ内に直接挿入されるので、XSL を記述する方法を知る必要はありません。ただし、XSL を直接カスタマイズする場合は、いつでもページをコード ビューで開くことができます。

注:  データ ビューでユーザーがレコードを追加または変更できるようにする別の方法として、データ ビューでのインライン編集を有効にすることもできます。リスト ビューとデータ ビューのカスタマイズの詳細については、[参照] セクションのリンク先を参照してください。

ページの先頭へ

リボンを使用してフォームを挿入する

フォームを最も簡単にすばやく作成するには、SharePoint Designer 2010 のリボンの [データ ビュー/フォーム] オプションを使用します。この方法で作成する場合は、新しいアイテムのフォーム、アイテムを編集するフォーム、およびアイテムを表示するフォームの 3 種類から選択できます。各フォームは、SharePoint リストやライブラリ、XML ファイル、データベース接続などのデータ ソースに対して作成できます。

この方法でフォームを追加すると、SharePoint Designer 2010 によってデータ フォーム Web パーツ (DFWP) がページに追加されます。フォームの追加後に、リボンのデータ ビュー編集オプションおよびページ自体の WYSIWYG ツールを使用してフォームをカスタマイズできます。

SharePoint Designer 2010 のリボンを使用してフォームを挿入するには、次の手順を実行します。

  1. 手順 1. SharePoint Designer 2010 でサイトを開きます。

  2. ナビゲーション ウィンドウで、[サイト ページ] をクリックします。

  3. データ フォームを追加するサイト ページを選択します。
    データ フォームの追加先のページが存在しない場合は、そのページ (ASPX ページまたは Web パーツ ページ) を作成する必要があります。

  4. [ページ] タブの [編集] で [ファイルの編集] をクリックします。

  5. 表示された div ボックスまたは form ボックスの内部をクリックします。
    Web パーツ ページでは、div タグ ボックスが次のように表示されます。
    SharePoint Designer 2010 でサイトを開く
    ASPX ページでは、form ボックスが次のように表示されます。
    SharePoint Designer 2010 でサイトを開く

  6. [挿入] タブの [データ ビュー/フォーム] に 3 つのフォーム オプションが表示されます。
    SPD のフォーム

  7. フォームの種類を選択します。各フォームの説明は次のとおりです。

  8. [新しいアイテムのフォーム] には、1 つのレコード用の空白フィールドが表示されます。各フィールドはそれぞれの行に表示され、フィールド名はその行の見出しになります。このフォームでは、一度に 1 つのレコードについてデータ ソースにデータを追加できます。ユーザーが新しいレコードを作成するために必要なすべてのフィールドを含める必要があります。

  9. [アイテムを編集するフォーム] には、1 つのレコードがフォーム形式で表示されます。各フィールドはそれぞれの行に表示され、フィールド名はその行の見出しになります。このフォームでは、一度に 1 つのレコードを編集できます。フォームには移動リンクがあり、これを使用して次のレコードまたは前のレコードを表示できます。

  10. [アイテムを表示するフォーム] には、レコードが編集不能なビューとして表示されます。通常、レコードのプロパティを表示するために使用します。

    注:  複数のアイテムを同時に表示するフォームを追加する場合は、以下の [データ ソースの詳細] 作業ウィンドウでフォームを作成する手順を参照してください。

  11. 使用するデータ ソースを選択します。

    注:  メニューのオプションの 1 つでは、[ユーザー設定のリスト フォーム] を作成します。これは、SharePoint リストおよびライブラリにのみ適用されます。リスト フォームの詳細については、[参照] セクションのリンク先を参照してください。

  12. その他のデータ ソースを表示するには、[データ ソースの選択] ダイアログ ボックスの [その他のデータ ソース] をクリックし、データ ソースを選択して [OK] をクリックします。

  13. フォームがページに追加され、データ ソースからのフィールドが表示されます。

ページの先頭へ

[データ ソースの詳細] ウィンドウを使用してフォームを挿入する

フォームを作成する別の方法としては、空のデータ ビューを挿入します。次にデータ ソースを選択し、[データ ソースの詳細] ウィンドウを使用して各フィールドを追加します。このオプションでは、最初にフォームに含めるフィールドを選択し、次に使用するフォームの種類を選択できます。単一アイテム フォーム、複数アイテム フォーム、新しいアイテムのフォームから選択できます。

この方法でフォームを追加すると、SharePoint Designer 2010 によってデータ フォーム Web パーツ (DFWP) がページに追加されます。追加したフォームは、リボンのデータ ビュー編集オプションおよびページ自体の WYSIWYG ツールを使用してカスタマイズできます。

SharePoint Designer 2010 の [データ ソースの詳細] ウィンドウを使用してフォームを挿入するには、次の手順を実行します。

  1. SharePoint Designer 2010 でサイトを開きます。

  2. ナビゲーション ウィンドウで、[サイト ページ] をクリックします。

  3. データ フォームを追加するサイト ページを選択します。
    データ ビュー用のページが存在しない場合は、そのページ (ASPX ページまたは Web パーツ ページ) を作成する必要があります。詳細については、[参照] セクションの「SharePoint ページを作成する」を参照してください。

  4. [ページ] タブの [編集] で [ファイルの編集] をクリックします。

  5. 表示された div ボックスまたは form ボックスの内部をクリックします。
    Web パーツ ページでは、div タグ ボックスが次のように表示されます。
    SharePoint Designer 2010 でサイトを開く
    ASPX ページでは、form ボックスが次のように表示されます。
    SharePoint Designer 2010 でサイトを開く

  6. [挿入] タブの [データ ビュー/フォーム] で、[データ ビュー] をクリックし、[空のデータ ビュー] を選択します。

  7. 表示される空のデータ ビューで、[ここをクリックして、データ ソースを選択してください] をクリックします。
    SharePoint Designer 2010 でサイトを開く

  8. [データ ソースの選択] ダイアログ ボックスでデータ ソースを選択し、[OK] をクリックします。

  9. [データ ソースの詳細] 作業ウィンドウが表示されます。
    SharePoint Designer 2010 でサイトを開く

  10. 作業ウィンドウで、データ フォームに表示するフィールドを選択します。複数のフィールドを選択するには、Ctrl キーを押しながらフィールドをクリックします。

    注:  使用するデータ ソースの種類によっては、一部のフィールドが編集できない場合があります。たとえば、SharePoint リストやライブラリでは、[作成者] や [更新者] などのフィールドは編集できません。

  11. [選択したフィールドの挿入] をクリックし、次のいずれかのオプションを選択します。

    • [単一アイテム フォーム] には、1 つのレコードがフォーム形式で表示されます。各フィールドはそれぞれの行に表示され、フィールド名はその行の見出しになります。このフォームでは、一度に 1 つのレコードを編集できます。フォームには移動リンクがあり、これを使用して次のレコードまたは前のレコードを表示できます。

    • [複数アイテム フォーム] には、複数のレコードがフォーム形式で同じページに表示されます。各フィールドはそれぞれの列に表示され、フィールド名はその列の見出しになります。このフォームでは、複数のレコードのデータをすばやく編集し、同時に変更内容を保存できます。

    • [新しいアイテムのフォーム] には、1 つのレコード用の空白フィールドが表示されます。各フィールドはそれぞれの行に表示され、フィールド名はその行の見出しになります。このフォームでは、一度に 1 つのレコードについてデータ ソースにデータを追加できます。ユーザーが新しいレコードを作成するために必要なすべてのフィールドを含める必要があります。

  12. データ フォームがサイト ページに追加されます。

ページの先頭へ

次の手順

作成したデータ ビューは、SharePoint Designer 2010 のデータ ビュー ツールや WYSIWYG 書式設定ツールを使用してカスタマイズできます。列の追加や削除、データへのフィルターの適用、フィールドの並べ替えやグループ化、条件付き書式の設定などが可能です。WYSIWYG ツールを使用して、テーブル全体のレイアウトの変更、グラフィックスの追加、テキストの書式設定などを行うこともできます。リスト ビューとデータ ビューのカスタマイズの詳細については、[参照] セクションのリンク先を参照してください。

重要:  フォームを使用する場合は、必要に応じて列見出しに説明文を追加し、フィールドに入力するデータの条件を説明するなど、フォームをカスタマイズする必要があります。たとえば、SQL データベースをデータ ソースとして使用する場合、フィールドによっては数値の入力が必要になります。ユーザーが間違えてテキストを入力すると、フォームを保存するときにエラー メッセージが表示されます。このような入力条件を伴うフィールドの横には説明を追加します。

ページの先頭へ

スキルを磨く
トレーニングの探索
新機能を最初に入手
Office Insider に参加する

この情報は役に立ちましたか?

ご意見をいただきありがとうございます。

フィードバックをお寄せいただき、ありがとうございます。Office サポートの担当者におつなぎいたします。

×