スクロール可能領域

スクロール可能領域は、コンテンツが時間の経過とともに下から上にスクロールする区画です。

HTML コンテンツはいずれもスクロールできます。スクローラー内のすべてのものが、機能するリンクと画像を含む操作可能な HTML です。

スクロール可能な領域を作成するには、多くの場合 UI ページで、スクロールするコンテンツを scrollable_area タグでラップします。

    <g:scrollable_area height="100px">
        <g2:evaluate var="jvar_temp" expression="var kb = new GlideRecord('kb_knowledge');"/>
        <g:inline template="kb_section.xml"/>
    </g:scrollable_area>

高さ 100 ピクセルの区画が作成され、コンテンツが自動的に下から上にスクロールされます。たとえば、高さ 1000 ピクセルのテキストブロックがある場合、上位 100 ピクセル、2 ～ 101 ピクセル、3 ～ 102 ピクセルの順に表示されます。最上部に達すると、下に折り返されます。

このサンプルコードは、優先度 1 のインシデントのリストを使用してスクローラーを作成します。

<?xml version="1.0" encoding="utf-8" ?>
<j:jelly trim="false" xmlns:j="jelly:core" xmlns:g="glide" xmlns:j2="null" xmlns:g2="null">
  <g2:evaluate var="jvar_inc">
    var inc = new GlideRecord('incident');
    inc.addActiveQuery();
    inc.addQuery('priority',1);
    inc.query();
  </g2:evaluate>

  <g2:scrollable_area height="100px"> 
    <table border="0" cellspacing="2" cellpadding="0" width="100%">
      <j2:while test="$[inc.next()]">
        <j2:set var="jvar_inc_link" value="incident.do?sys_id=$[inc.sys_id]"/>
        <j2:set var="jvar_inc_list_link" value="incident_list.do?sysparm_query=active=true"/>
	<tr>
	  <td>
            <a href="$[jvar_inc_link]">
              <IMG SRC="images/services.png" style="padding-right:10px"></IMG>
            </a>
            <a href="$[jvar_inc_link]" style="padding-right:10px; color:blue">$[inc.number]</a>
          </td>
          <td>$[inc.short_description]</td>
        </tr>
      </j2:while>
      <tr>
        <td align="center" colspan="2"><a href="$[jvar_inc_list_link]" style="color:blue">View all active incidents</a></td>
      </tr>
    </table>
  </g2:scrollable_area> 
</j:jelly>

• フォームのスクロール要素の追加
  フォームや UI ページにスクロール領域を追加できます。