스크롤 가능 영역
스크롤 가능한 영역은 시간이 지남에 따라 내용이 아래에서 위로 스크롤되는 div입니다.
모든 HTML 콘텐츠를 스크롤할 수 있으며 스크롤러 내부의 모든 항목은 작동하는 링크와 이미지가 있는 작동 가능한 HTML입니다.
스크롤 가능한 영역을 만들려면 스크롤 콘텐츠를 scrollable_area 태그 안(예: UI 페이지)으로 래핑합니다.
<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픽셀 높이의 div를 만들고 내용은 자동으로 아래에서 위로 스크롤됩니다. 예를 들어 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>