HTML フォーム Web パーツを使用して、別の Web パーツ内のデータをフィルター処理して表示する

注: 最新のヘルプ コンテンツをできるだけ早く、お客様がお使いの言語で提供したいと考えております。このページは、自動翻訳によって翻訳されているため、文章校正のエラーや不正確な情報が含まれている可能性があります。私たちの目的は、このコンテンツがお客様の役に立つようにすることです。お客様にとって役立つ情報であったかどうかを、このページの下部でお知らせください。簡単に参照できるように、こちらに英語の記事があります。

注: この記事は既に役割を終えており、間もなく提供終了となります。Microsoft では、「ページが見つかりません」の問題を避けるために既知のリンクを削除しています。このページへのリンクを作成された場合は、同様に、この問題を避けるためにリンクを削除してください。

HTML フォーム web パーツを使用して、リストビュー web パーツなどの別の web パーツに接続し、データを渡すことができます。

この記事の内容:

フォーム Web パーツを使用する

Web パーツをページに追加する

HTML フォーム web パーツを別の web パーツに接続する

HTML フォーム Web パーツをカスタマイズする

既定の HTML フォーム Web パーツをカスタマイズする

複数行のテキストボックスを使用する

オプションボタンを使用する

選択肢のドロップダウンリストを使用する

チェックボックスを使用する

Web パーツの共通プロパティを構成する

外観

レイアウト

上級

フォーム Web パーツを使用する

HTML フォーム web パーツを使用して、別の web パーツにデータを接続して渡すことができます。 たとえば、既定の HTML フォーム web パーツを使用して、地域名を入力し、顧客データのリストビュー web パーツに値を渡し、その地域によってデータをフィルター処理することができます。また、HTML フォーム Web パーツをカスタマイズして、ユーザーを有効にすることもできます。たとえば、ドロップダウンリストから地域名を選択します。HTML フォーム Web パーツでは、テキストボックス、ドロップダウンリスト、複数行のテキストボックス、チェックボックス、またはオプションボタンを使うことができます。

フィールドを他の web パーツに接続する方法は、他の web パーツが web パーツ接続を使用するように定義されている方法によって異なります。

フォームには複数の要素 (テキストボックス、ラジオボタンなど) を設定できますが、リストビュー Web パーツに接続できるフィールドは1つだけです。 ただし、さまざまなフィールドを別の Web パーツに同時に接続することはできます。たとえば、テキストボックスと一連のオプションボタンを使用して HTML フォーム Web パーツを作成することができます。テキストボックスは、1つのリストビュー Web パーツに接続することができます。また、オプションボタンを別のものにすることも可能です。ユーザーが [ Go ] ボタンをクリックすると、両方のリストビュー web パーツは HTML フォーム web パーツに入力された情報に従ってフィルター処理が行われます。

その web パーツが複数のパラメーターを受け入れることができる場合は、HTML フォーム web パーツ内の2つ以上のフィールドを別の web パーツに接続できます。この場合、sharepoint Designer 2010 などの sharepoint 互換の Web デザインプログラムを使用して接続を完了する必要がある場合があります。

ページの先頭へ

Web パーツをページに追加する

ページを編集するには、最低でも、サイトの既定の "<サイト名> のメンバー" という SharePoint グループに参加することによって得られる権限が必要です。

  1. ページで、リボンの [ページ] タブをクリックして、[編集] をクリックします。

    [ページ] タブの [編集] コマンド

    [編集] が無効になっている場合、ページを編集する権限がない可能性があります。管理者にお問い合わせください。

  2. Web パーツを追加するページをクリックし、[挿入] タブをクリックして、[Web パーツ] をクリックします。

    [Web パーツ] コマンド

  3. [カテゴリ] で、カテゴリ ([リストとライブラリ] など) をクリックし、ページに追加する Web パーツ ([お知らせ] など) をクリックして、[追加] をクリックします。

    Web パーツの選択

  4. Web パーツを選ぶと、その Web パーツに関する情報が [Web パーツに関する情報] に表示されます。

  5. ページの編集が完了したら、[ページ] タブをクリックして、[保存して閉じる] をクリックします。

ページの先頭へ

HTML フォーム web パーツを別の web パーツに接続する

HTML フォーム web パーツを使用するには、リストビュー web パーツなど、web パーツ接続を通じて値を受け取ることができる別の web パーツに接続します。フィルターを適用するリストと、フィルターを適用する列は、HTML フォーム web パーツと同じページの web パーツに表示されている必要があります。HTML フォーム web パーツをページに追加する方法の詳細については、「 web パーツをページに追加する」を参照してください。

  1. フィルター処理する Web パーツが含まれているページを参照します。

  2. リボンの [ページ] タブをクリックし、[編集] をクリックします。

    [編集] が無効になっている場合、ページを編集する権限がない可能性があります。管理者にお問い合わせください。

  3. HTML フォーム Web パーツをポイントし、下向き矢印をクリックし、[接続] をクリックし、[フォームの値を指定] をポイントして、リンク先の web パーツの名前をクリックします。

  4. [接続の選択] ダイアログボックスで、[接続の構成] タブをクリックします。

  5. [接続の種類] メニューで、HTML フォーム Web パーツの情報と一致するフィールドを選びます。

注: フィールドには同じ名前を付ける必要はなく、同じデータ型にする必要もありません。HTML フォーム Web パーツから送信された値は、テキスト値です。

  1. [完了] をクリックし、ページの上部にある [編集モードの終了] をクリックします。

既定では、テキストボックスにテキストを入力し、[移動] をクリックするか、enter キーを押します。その他の Web パーツには、入力したテキストと一致するデータのみが表示されます。テキストボックスをクリアして新しいテキストを入力できるようにするには、現在のテキストを選択してから削除します。

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

HTML フォーム Web パーツをカスタマイズする

html フォーム web パーツをカスタマイズするには、html フォーム web パーツのツールウィンドウから入手できるソースエディターか、sharepoint Designer 2010 などの sharepoint 互換の web デザインプログラムを使用します。[標準] テキストボックスの代わりに、オプションボタン、チェックボックス、複数行のテキストボックス、リストボックスを使うことができます。ラベルを追加して既定値を割り当てることもできます。

HTML フォーム Web パーツをカスタマイズする場合は、次の点に注意してください。

  • 他の Web パーツにデータを渡すために使うことができるのは、 Goボタン (INPUT 要素を使用する) が1つだけです。

  • HTML フォーム Web パーツは form 要素を使用します。特定の html 要素は、html、BODY、form 要素など、form 要素内で使うことはできません。

  • すべてのフォーム フィールド名は一意であることが必要です。 それぞれの名前の値は、接続先の Web パーツ内の対応する列名に接続するために使用されます。

フォーム Web パーツをカスタマイズするには、[ソースエディター ] ボタンを使用して [テキストエディター ] ダイアログボックスを表示し、HTML ソースコードを変更または追加します。

注: HTML フォーム web パーツは、別の接続可能な web パーツにデータを提供しますが、別の接続可能な web パーツからデータを取得することはできません。たとえば、HTML フォーム Web パーツを詳細フォームとして使用して、データの行を表示することはできません。

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

既定の HTML フォーム Web パーツをカスタマイズする

既定の HTML フォーム Web パーツをカスタマイズするには、次の操作を行います。

  1. HTML フォーム Web パーツが表示されているページで、リボンの [ 編集] タブをクリックし、 [編集] をクリックします。

  2. HTML フォーム web パーツをポイントし、下向き矢印をクリックして、[ web パーツの編集] をクリックします。

  3. ツールウィンドウで、[ソースエディター ] ボタンをクリックします。

  4. [テキスト入力] ダイアログボックスが開き、既定の HTML コードが表示されます。

コードを読みやすくして変更するには、次に示すように、テキストに改行を挿入して行を区切ります。

<div onkeydown="javascript:if (event.keyCode == 13) _SFSUBMIT_">
<input type="text" name="T1"/>
<input type="button" value="Go" onclick="javascript:_SFSUBMIT_"/>
</div>

フィールドの名前を変更したり、フィールドにラベルを追加したり、既定値を追加したりすることによって、最初の INPUT 要素をいくつかの方法で変更することができます。

プロパティ

説明

フィールド名

フォーム Web パーツの既定のテキストボックスの名前は、 T1です。これは、[構成の接続] ダイアログボックスに表示される名前です。フィールドにわかりやすい名前を付けるには、 T1の代わりに新しい名前を入力します。引用符は削除しないでください。

フィールドラベル

フォームフィールドの前または後にラベルテキストを追加できます。テキストを引用符なしで入力します。

既定値

[テキスト領域] フィールドに既定値を追加できます。ユーザーは、[移動] ボタンをクリックして値を受け入れるか、独自のエントリを入力して上書きすることができます。既定値を追加するには、value 属性を使用します。

たとえば、よりわかりやすい名前を指定し、既定値を追加し、ラベルを追加する場合は、次の操作を行うことができます。

Region: <input type="text" name="Region" value="India"/>

次の例に示すように、ボタンの名前を変更して、2番目の INPUT 要素を変更できます。

<input type="button" value="SUBMIT" onclick="javascript:_SFSUBMIT_"/>

DIV 要素の前後に他の HTML 要素を追加することもできます。たとえば、ユーザーがすばやくページを更新し、フォーム要素をリセットできるようにする非常に便利で簡単な方法は、DIV 要素の終了後に現在のページのアンカータグを追加することです。例えば:

<br/>
<a href="http://contoso/SitePages/CustByRegion.aspx">Refresh</a>

重要: [テキストエディター ] ダイアログボックスでは、他の HTML コードを変更しないでください。HTML フォーム web パーツは、実行時にスクリプトルーチンを動的に作成し、他の web パーツへの接続を作成します。onkeydownまたはonclickイベントコードを変更したり、HTML フォーム Web パーツを誤って壊したりすることはありません。

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

複数行のテキストボックスを使用する

要素は、複数行のテキスト入力コントロールを定義します。ROWS 属性は、テキストフィールドに表示される行数を指定します。列数属性は、文字のテキスト領域の幅を指定します。次の例では、ユーザーは5行のテキストボックスと幅30文字を表示しています。ユーザーがボックスにテキストを入力すると、テキストは30文字で折り返されます。

<textarea name="Region" rows=5 cols=30></textarea>

ヒント: 右の角かっこ (>) の直後にソースコードにスペースが含まれていないことを確認します。

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

オプションボタンを使用する

オプションボタンは、ラジオボタンとも呼ばれ、ユーザーに対して相互に排他的な選択肢を提供します。次の例では、3つのラジオボタンを表示します。各ラジオボタンに同じ名前を使用します。各ボタンの後にラベルを追加するのが通例です。各ラジオボタンを別々の行に書式設定する場合は、BR 要素を使用します。

<input type="radio" name="Region" value="India"/> India<BR/>
<input type="radio" name="Region" value="USA"/> USA<BR/>
<input type="radio" name="Region" value="Spain"/> Spain<BR/>

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

選択肢のドロップダウンリストを使用する

相互に排他的な選択肢が多い場合は、SELECT 要素を使用してドロップダウンリストボックスを使用することを検討してください。各オプションはリスト内で別の選択肢として表示されますが、ユーザーは1つの選択肢のみを選ぶことができます。OPTION 要素の終了角かっこの後のテキストは、ドロップダウンリストに表示されます。

<select name="Region">
<option value="India">India</option>
<option value="USA">USA</option>
<option value="Spain"> Spain </option>
</select>

スペインなどの既定値を指定するには、次の操作を行います。

<option value="Spain" selected="selected"> Spain </option>

<link xlink:href="6b4ab13a-32a7-427f-8dbc-a076ae2e6132#__top">ページの先頭へ</link>

チェックボックスを使用する

複数の非相互排他的な選択肢がある場合は、チェックボックスを使用することを検討してください。各オプションは個別のチェックボックスとして表示され、ユーザーはいずれか、またはすべての選択肢を選ぶことができます。このオプションを使用するには、web パーツ接続の一部として複数のパラメーターを受け付ける web パーツが必要です。

<input type="checkbox" name="region1" value="India"/> India<BR/>
<input type="checkbox" name="region2" value="USA"/> USA<BR/>
<input type="checkbox" name="region3" value="Spain"/> Spain<BR/>

スペインなどの既定値を指定するには、次の操作を行います。

<input type="checkbox" name="region3" value="Spain" checked="checked"/> Spain<BR/> 

ページの先頭へ

Web パーツの共通プロパティを構成する

Web パーツは、見た目、レイアウト、詳細な特性を制御するための一連の共通プロパティを共有しています。Web パーツのプロパティは、ツール ウィンドウで変更します。

注: ツール ウィンドウに表示される共通の Web パーツ プロパティは、いくつかの理由で、このセクションに記載されている内容と異なる場合があります。

  • ツール ウィンドウの [詳細設定] セクションを表示するには適切な権限が必要であるため。

  • 特定の web パーツの場合、web パーツ開発者は、これらの一般的なプロパティを1つ以上表示しないように選択したか、外観レイアウト、およびその他のプロパティを作成して表示するように選択している可能性があります。ツールウィンドウの [詳細] セクション。

  • 一部の権限やプロパティの設定によって、Web パーツのプロパティが無効または非表示になっているため。

外観

プロパティ

説明

タイトル

Web パーツのタイトル バーに表示される Web パーツのタイトルを指定します。

高さ

Web パーツの高さを指定します。

Web パーツの幅を指定します。

枠の状態

ページを開くときに、Web パーツ全体をページ上に表示するかどうかを指定します。既定では、枠の状態は [標準] に設定され、Web パーツ全体が表示されます。枠の状態を [最小化] に設定すると、タイトル バーだけが表示されます。

枠の種類

タイトル バーや Web パーツ フレームの枠線を表示するかどうかを指定します。

レイアウト

プロパティ

説明

非表示

ユーザーがページを開いたときに、Web パーツが表示されるかどうかを指定します。 このチェック ボックスをオンにした場合、自分でページをデザインしているときにのみ Web パーツが表示され、タイトルには "(非表示)" という接尾辞が追加されます。

Web パーツ接続を介して他の Web パーツにデータを提供するときに、Web パーツそのものは表示したくない場合、Web パーツを非表示にすることができます。

方向

Web パーツのコンテンツにおける文字の方向を指定します。たとえば、アラビア語は右から左に記述され、英語を含むほとんどの欧州言語は左から右に記述されます。Web パーツの種類によっては、この設定を使用できないことがあります。

ゾーン

Web パーツが位置するページ上の領域を指定します。

注: ページ上の領域を変更する権限がない場合、領域はリスト ボックスに表示されません。

領域のインデックス

領域に複数の Web パーツが存在する場合に、その領域内の Web パーツの位置を指定します。

順序を指定するには、テキスト ボックスに正の整数を入力します。

領域内の Web パーツが上から下に配置されている場合、値 1 は Web パーツが領域の最上部に表示されることを意味します。領域内の Web パーツが左から右に配置されている場合、値が 1 の Web パーツが領域の左に表示されます。

たとえば、上から下に配置されている空の領域に Web パーツを追加する場合、領域のインデックスは 0 です。領域の一番下に 2 つ目の Web パーツを追加する場合、領域のインデックスは 1 になります。2 つ目の Web パーツを領域の最上部に移動するには「0」と入力し、1 つ目の Web パーツについては「1」を入力します。

注: ゾーン内の Web パーツにはそれぞれ、ゾーンのインデックスとして一意の値が割り当てられている必要があります。したがって、現在の Web パーツの領域のインデックス値を変更すると、その領域内の他の Web パーツの領域のインデックス値も変更される可能性があります。

詳細設定

プロパティ

説明

最小化を許可する

Web パーツを最小化できるかどうかを指定します。

閉じるのを許可する

Web パーツをページから削除できるかどうかを指定します。

非表示を許可する

Web パーツを非表示にできるかどうかを指定します。

領域の変更を許可する

Web パーツを別の領域に移動できるかどうかを指定します。

接続を許可する

Web パーツを他の Web パーツに接続できるかどうかを指定します。

個人用ビューでの編集を許可する

Web パーツのプロパティを個人用ビューで変更できるかどうかを指定します。

エクスポート モード

この Web パーツに関してエクスポートを許可するデータのレベルを指定します。構成によっては、この設定が利用できない場合もあります。

タイトル URL

Web パーツについての追加情報を含むファイルの URL を指定します。Web パーツのタイトルをクリックすると、このファイルが別のブラウザー ウィンドウに表示されます。

説明

Web パーツのタイトルや Web パーツのアイコンをマウスでポイントしたときに表示されるヒントを指定します。このプロパティの値は、ツール ウィンドウの [Web パーツの検索] の [検索] コマンドを使った Web パーツ検索時に使われます。

ヘルプ URL

Web パーツについてのヘルプ情報を含むファイルの場所を指定します。Web パーツ メニューの [ヘルプ] をクリックすると、ヘルプ情報が別のブラウザー ウィンドウに表示されます。

ヘルプ モード

Web パーツのヘルプ コンテンツをブラウザーでどのように表示するかを指定します。

次のいずれかを選びます。

• [モーダル] 別のブラウザー ウィンドウに表示されます (ブラウザーがこの機能をサポートしている場合)。元の Web ページに戻るには、ウィンドウを閉じる必要があります。

• [モードレス] 別のブラウザー ウィンドウに表示されます (ブラウザーがこの機能をサポートしている場合)。ウィンドウを閉じなくても元の Web ページに戻ることができます。これが既定値です。

• [移動] Web ページが現在のブラウザー ウィンドウに表示されます。

注: カスタムの Microsoft ASP.NET Web パーツがこのプロパティをサポートしている場合でも、SharePoint の既定のヘルプ トピックは必ず別のブラウザー ウィンドウで表示されます。

カタログ アイコン画像の URL

Web パーツの一覧で Web パーツ アイコンとして使用する画像が格納されたファイルの場所を指定します。画像のサイズは 16 × 16 ピクセルである必要があります。

タイトル アイコン画像の URL

Web パーツのタイトル バーで使用する画像が格納されたファイルの場所を指定します。画像のサイズは 16 × 16 ピクセルである必要があります。

エラー メッセージのインポート

Web パーツのインポートで問題が発生した場合に表示されるメッセージを指定します。

ページの先頭へ

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

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

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

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

×