複数の値を使用してページに埋め込まれたレポートをフィルタリングする方法

お知らせ：当社は、お客様により充実したサポート情報を迅速に提供するため、本ページのコンテンツは機械翻訳を用いて日本語に翻訳しています。正確かつ最新のサポート情報をご覧いただくには、本内容の英語版を参照してください。

ページ上でレポートを組み込む際に、Zoho Creatorは直接レポートをフィルタリングするための組み込みフィルターオプションを提供します。しかし、複数の値で動的にフィルタリングを行う場合は、値をページ変数に渡し、それを使用してレポートをフィルタリングします。この方法は柔軟性を提供し、さまざまなシナリオに適しています。

メモ:ページ上で複数の値を用いてレポートをフィルタリングするには、レポートは公開済みであり、HTMLスニペット内のiframeに埋め込まれる必要があります。

レポートを公開してアプリケーションでフィルタリングが必要なレポートを生成し、そして埋め込みコードを生成します。
ページを作成するか、フィルタリングされたレポートを埋め込む予定のページビルダーに移動し、以下のページ変数を追加します。

変数名

データタイプ

filter_values TEXT

次のものを追加します。ページスクリプトを使ってページ変数に値を供給します。レポートは指定された値に基づいてフィルタリングされます。

//ページ変数にフィルタリングのための値のリストを割り当てます。レポートは言及された値に基づいてフィルタリングされます。
input.filter_values = '[<値 1>, <値 2>, <値 3>]';

左側のペインのスニペットセクションにリストされるHTMLスニペット要素をページにドラッグアンドドロップします。

スニペットに次のスクリプトを追加します。

// レポートを公開する際に作成された埋め込みコードを貼り付けます。
// レポートがフィルタリングする必要がある項目の項目リンク名を、埋め込みコードの最後にクエリパラメータとして追加します。
// クエリパラメータの入力値としてページ変数を供給します。
<%{
%>
&lt;/span&gt;&lt;/li&gt; &lt;li style='background-color: rgb(245, 245, 245); border-left: 2px solid rgb(204, 204, 204); margin: 1px; padding: 2px'&gt;&lt;span style=''&gt;&amp;lt;%&lt;/span&gt;&lt;/li&gt; &lt;li style='background-color: rgb(245, 245, 245); border-left: 2px solid rgb(204, 204, 204); margin: 1px; padding: 2px'&gt;&lt;span style=''&gt;}%&amp;gt;&lt;/span&gt;&lt;/li&gt; &lt;/ol&gt;&lt;/ol&gt;&lt;div&gt; &lt;br&gt; &lt;/div&gt;&lt;div&gt; ここで、 &lt;br&gt; &lt;/div&gt;&lt;div&gt; &lt;table style='border-width: 1px; border-style: solid; border-color: rgb(51, 51, 51); table-layout: fixed; text-align: initial; overflow-wrap: break-word; border-collapse: collapse; background-color: transparent; max-width: 100%' cellspacing='0' cellpadding='10'&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td style='border-width: 1px; border-style: solid; border-color: rgb(51, 51, 51); min-height: 50px; min-width: 50px; width: 398px; height: 156px'&gt; &lt;div&gt; &lt;iframe height='500px' width='100%' frameborder='+10、-10' allowtransparency='真' scrolling='auto' src='&lt;a target=&amp;quot;_blank&amp;quot; href=&amp;quot;https://creatorapp.zohopublic.com/zylker/task-management/report-embed/All_Employee_Details/DT1vxxxxxwPDhuJuTms2356vUUghGxZgZGGhCfHuzkZrnF8XufgzsCyTd7v2NuDfH8XP9TmX5bU2Sm6zY5w6C0Ztbh1vBgmKx7AE&amp;quot; rel=&amp;quot;noopener noreferrer&amp;quot;&gt;https://creatorapp。zohopublic。com/zylker/タスク-management/レポート-embed/All_Employee_Details/DT1vxxxxxwPDhuJuTms2356vUUghGxZgZGGhCfHuzkZrnF8XufgzsCyTd7v2NuDfH8XP9TmX5bU2Sm6zY5w6C0Ztbh1vBgmKx7AE'&gt;&lt;/a&gt; &lt;/div&gt;&lt;/td&gt; &lt;td style='border-width: 1px; border-style: solid; border-color: rgb(51, 51, 51); min-height: 50px; min-width: 50px; width: 438px; height: 156px'&gt; &lt;div&gt;レポートを出版すると、埋め込みコードが作成されます。&lt;/div&gt;&lt;/td&gt; &lt;tr&gt; &lt;td style='border-width: 1px; border-style: solid; border-color: rgb(51, 51, 51); min-height: 50px; min-width: 50px; width: 398px; height: 39px'&gt; &lt;div&gt;field_link_name&lt;/div&gt;&lt;/td&gt; &lt;td style='border-width: 1px; border-style: solid; border-color: rgb(51, 51, 51); min-height: 50px; min-width: 50px; width: 438px; height: 39px'&gt; &lt;div&gt;レポートがフィルタリングする必要がある項目のリンク名&lt;/div&gt;&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; &lt;/div&gt; &lt;h2 class='toc_anchors' id='See_how_it_works'&gt;&lt;span style=''&gt;動作方法を確認&lt;/span&gt;&lt;br&gt;&lt;/h2&gt; &lt;div&gt; &lt;iframe sandbox='allow-scripts allow-forms allow-same-origin allow-presentation allow-popups allow-downloads allow-popups-to-escape-sandbox' src='https://workdrive.zohoexternal.com/embed/abvddd053bc2de4044ed1ad5a1aa96eeb0a7b?toolbar=false&amp;amp;amp;appearance=light&amp;amp;amp;themecolor=green' allowfullscreen='true' width='800' height='450' title='Embed code'&gt;

関連リンク