====== tooltipbox 속성 가이드======
tooltipbox 속성에 대한 예시 화면이다.
tooltipbox 속성은 확장 도움말로 나타날 텍스트 설정한다.
tooltipbox 속성은 단순 문자열 또는 JSON 문자열로 설정한다.
JSON 문자열의 title, content는 문자열 또는 문자열 배열로 설정한다.
===== 예시 =====
템플릿 위치: /HTML5/COMPONENT/COMMON/tooltipbox_basic
템플릿 파일
* [[xf5projecthome>template/screen/HTML5/COMPONENT/COMMON/tooltipbox_basic.xml|tooltipbox_basic.xml]]
* [[xf5projecthome>template/screen/HTML5/COMPONENT/COMMON/tooltipbox_basic.js|tooltipbox_basic.js]]
* [[xf5projecthome>template/template.html?xframe_screen_url=/HTML5/COMPONENT/COMMON/tooltipbox_basic|새창으로 실행]]
echo '';
echo '';
echo '';
==== 화면 스크립트 ====
function screen_on_load()
{
}
function btn_settooltipbox_on_mouseup(objInst)
{
var arrTitle, arrCotent, objTooltipBox;
arrTitle = [];
arrTitle.push("ID 규칙");
// 문자열 내에 큰 따옴표가 있어야 하는 경우, 역슬래시 문자를 이용하여 이스케이프 처리해야 함.
arrCotent = [];
arrCotent.push("\"ID 상세 규칙\"은 아래와 같습니다.
");
arrCotent.push("");
arrCotent.push("- 최소 8자리 이상
");
arrCotent.push("- 영어 대문자, 소문자, 숫자, 특수문자 중 2종류 조합
");
arrCotent.push("");
objTooltipBox = {
// placement, horz_align, vert_align, width는 필요시에만 지정
/*
placement: 1, // 0:left, 1:right, 2:top, 3:bottom
horz_align: 0, // 0:left, 1:center, 2:right
vert_align: 1, // 0:top, 1:center, 2:bottom
width: 400, // 최대 너비
*/
title: arrTitle, // 타이틀 문자열 배열 또는 문자열 지정
content: arrCotent // 내용 문자열 배열 또는 문자열 지정
};
fldTooltipBox.settooltipbox(factory.jsonstringify(objTooltipBox));
// factory.consoleprint(fldEffect.gettooltipbox());
}
function btn_settabitemtooltipbox_on_mouseup(objInst)
{
var objTooltipBox = {
"title": "동적 툴팁박스", // 타이틀 문자열
"content": [
"settabitemtooltipbox API를 통해서 설정합니다. ",
"조건에 따라 다양하게 설정이 가능합니다."
]
};
// 탭 아이템별 툴팁박스 정보 설정
tabTooltipBox.settabitemtooltipbox(1, factory.jsonstringify(objTooltipBox));
factory.consoleprint(tabTooltipBox.gettabitemtooltipbox(1));
}
function btn_setheadertooltipbox_on_mouseup(objInst)
{
var objTooltipBox = {
"title": "동적 툴팁박스", // 타이틀 문자열
"content": [
"setheadertooltipbox API를 통해서 설정합니다. ",
"조건에 따라 다양하게 설정이 가능합니다."
]
};
// 그리드 헤더 아이템별 툴팁박스 정보 설정
grdTooltipBox.setheadertooltipbox(1, 0, factory.jsonstringify(objTooltipBox));
factory.consoleprint(grdTooltipBox.getheadertooltipbox(1, 0));
}
function btn_setitemtooltipbox_on_mouseup(objInst)
{
var objTooltipBox = {
"title": "그리드 아이템 툴팁박스", // 타이틀 문자열
"content": [
"setitemtooltipbox API를 통해서 설정합니다. ",
"조건에 따라 다양하게 설정이 가능합니다."
]
};
// 그리드 데이터 아이템별 툴팁박스 정보 설정
grdTooltipBox.setitemtooltipbox(1, 0, factory.jsonstringify(objTooltipBox));
factory.consoleprint(grdTooltipBox.getitemtooltipbox(1, 0));
}