0.0.7 • Published 9 months ago
dialog
Simple dialog message

Browser Support
 |  |  |  |  |  |
---|
Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | Latest ✔ | ie 11 > |
build
npm run build
사용방법
var dialogObj = Daracl.dialog.create({
title: 'dialog', width: 500, height: 'auto', icon: "info", isModal: true, resizable: true, autoOpen: false, template: '<a href="https://varsql.com" target="_blank">링크 이동</a>', buttons: [
{
label: 'ok', styleClass: "info", callback: function (e) {
alert('ok')
}
}
, {
label: 'Cancel', callback: function (e) {
dialogObj.hide();
}
}
], afterOpen: function () {
console.log('after open')
}
});
dialog 옵션
key | 설명 | 기본값 | 옵션값 |
---|
width | 넓이 | 400 | |
height | 높이 | 300 | |
styleClass | css class | | |
isModal | 모달 사용여부 | false | |
icon | icon | | primary, secondary, info, success, warning, danger |
autoOpen | 자동 열기 여부 | true | |
draggable | drag 가능여부 | true | |
resizable | 창 리사이즈 여부 | false | |
enableHeader | 헤더 영역 보일지 여부 | true | |
enableFooter | 하단 버튼 영역 보일지 여부 | true | |
enableMaxButton | 최대화 버튼 | true | |
enableCloseButton | 닫기 버튼 활성화 여부 | true | |
minHeight | 최소 높이 | 130 | |
minWidth | 최소 넓이 | 230 | |
zIndex | css z-index | 10000 | |
dragOverflow | darg 창 넘어서 drag 할지 여부 | true | |
buttons | dialog 하단 버튼 | [] | |
moveDelay | drag delay time | 15 | |
afterOpen | 오픈후 발생할 이벤트 | false | |
dialog button 옵션
key | 설명 | 기본값 | 옵션값 |
---|
label | 버튼명 | '' | |
callback | 클릭시 callback | | |