216 lines
5.4 KiB
PHP
216 lines
5.4 KiB
PHP
|
|
<!DOCTYPE HTML>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<link rel="stylesheet" type="text/css" href="../css/common.css">
|
||
|
|
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||
|
|
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <!--날짜 선택 창 UI 필요 -->
|
||
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
|
||
|
|
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
|
||
|
|
<script src="./themes/alertify.js"></script>
|
||
|
|
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/alertifyjs@1.12.0/build/css/alertify.min.css"/>
|
||
|
|
<link rel="stylesheet" href="./themes/alertify.default.css"/>
|
||
|
|
|
||
|
|
<meta name="viewport" content="width=device-width">
|
||
|
|
<style>
|
||
|
|
.alertify-log-custom {
|
||
|
|
background: blue;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<title> 미래기업 통합정보시스템 </title>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
|
||
|
|
<!doctype html>
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
<title>alertify.js - example page</title>
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
<h2>Dialogs</h2>
|
||
|
|
<a href="#" id="alert">Alert Dialog</a><br>
|
||
|
|
<a href="#" id="confirm">Confirm Dialog</a><br>
|
||
|
|
<a href="#" id="prompt">Prompt Dialog</a><br>
|
||
|
|
<a href="#" id="labels">Custom Labels</a><br>
|
||
|
|
<a href="#" id="focus">Button Focus</a><br>
|
||
|
|
<a href="#" id="order">Button Order</a>
|
||
|
|
|
||
|
|
<h2>Ajax</h2>
|
||
|
|
<a href="#" id="ajax">Ajax - Multiple Dialog</a>
|
||
|
|
|
||
|
|
<h2>Logs</h2>
|
||
|
|
<a href="#" id="notification">Standard Log</a><br>
|
||
|
|
<a href="#" id="success">Success Log</a><br>
|
||
|
|
<a href="#" id="error">Error Log</a><br>
|
||
|
|
<a href="#" id="custom">Custom Log</a><br>
|
||
|
|
<a href="#" id="delay">Hide in 10 seconds</a><br>
|
||
|
|
<a href="#" id="forever">Persistent Log</a>
|
||
|
|
|
||
|
|
<h2>Themes</h2>
|
||
|
|
<a href="#" id="bootstrap">Bootstrap Theme</a>
|
||
|
|
<script>
|
||
|
|
function reset () {
|
||
|
|
$("#toggleCSS").attr("href", "../themes/alertify.default.css");
|
||
|
|
alertify.set({
|
||
|
|
labels : {
|
||
|
|
ok : "OK",
|
||
|
|
cancel : "Cancel"
|
||
|
|
},
|
||
|
|
delay : 5000,
|
||
|
|
buttonReverse : false,
|
||
|
|
buttonFocus : "ok"
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Standard Dialogs
|
||
|
|
$("#alert").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.alert("This is an alert dialog");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#confirm").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.confirm("This is a confirm dialog", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK");
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#prompt").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.prompt("This is a prompt dialog", function (e, str) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK and typed: " + str);
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
}, "Default Value");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Ajax
|
||
|
|
$("#ajax").on("click", function () {
|
||
|
|
reset();
|
||
|
|
alertify.confirm("Confirm?", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.alert("Successful AJAX after OK");
|
||
|
|
} else {
|
||
|
|
alertify.alert("Successful AJAX after Cancel");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Standard Dialogs
|
||
|
|
$("#notification").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.log("Standard log message");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#success").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.success("Success log message");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#error").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.error("Error log message");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Custom Properties
|
||
|
|
$("#delay").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.set({ delay: 10000 });
|
||
|
|
alertify.log("Hiding in 10 seconds");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#forever").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.log("Will stay until clicked", "", 0);
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#labels").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.set({ labels: { ok: "Accept", cancel: "Deny" } });
|
||
|
|
alertify.confirm("Confirm dialog with custom button labels", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK");
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#focus").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.set({ buttonFocus: "cancel" });
|
||
|
|
alertify.confirm("Confirm dialog with cancel button focused", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK");
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
$("#order").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.set({ buttonReverse: true });
|
||
|
|
alertify.confirm("Confirm dialog with reversed button order", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK");
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
});
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Custom Log
|
||
|
|
$("#custom").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
alertify.custom = alertify.extend("custom");
|
||
|
|
alertify.custom("I'm a custom log message");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
|
||
|
|
// ==============================
|
||
|
|
// Custom Themes
|
||
|
|
$("#bootstrap").on( 'click', function () {
|
||
|
|
reset();
|
||
|
|
$("#toggleCSS").attr("href", "../themes/alertify.bootstrap.css");
|
||
|
|
alertify.prompt("Prompt dialog with bootstrap theme", function (e) {
|
||
|
|
if (e) {
|
||
|
|
alertify.success("You've clicked OK");
|
||
|
|
} else {
|
||
|
|
alertify.error("You've clicked Cancel");
|
||
|
|
}
|
||
|
|
}, "Default Value");
|
||
|
|
return false;
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
</body>
|
||
|
|
</html>
|