[ax5dialog](#ax5dialog)
9 | * [.alert(config, [callback])](#ax5dialog.alert) ⇒ [ax5dialog](#ax5dialog)
10 | * [.confirm(config, [callback])](#ax5dialog.confirm) ⇒ [ax5dialog](#ax5dialog)
11 | * [.prompt(config, [callback])](#ax5dialog.prompt) ⇒ [ax5dialog](#ax5dialog)
12 | * [.close()](#ax5dialog.close) ⇒ [ax5dialog](#ax5dialog)
13 |
14 |
15 |
16 | ### ax5dialog.setConfig(config) ⇒ [ax5dialog](#ax5dialog)
17 | Preferences of dialog UI
18 |
19 | **Kind**: static method of [ax5dialog](#ax5dialog)
20 |
21 | | Param | Type | Default | Description |
22 | | --- | --- | --- | --- |
23 | | config | Object | | 클래스 속성값 |
24 | | [config.theme] | String | "default" | |
25 | | [config.width] | Number | 300 | |
26 | | [config.title] | String | "" | |
27 | | [config.zIndex] | Number | | |
28 | | [config.onStateChanged] | function | | `onStateChanged` function can be defined in setConfig method or new ax5.ui.dialog initialization method. However, you can us to define an event function after initialization, if necessary |
29 | | [config.lang] | Object | | |
30 | | [config.lang.ok] | String | "ok" | |
31 | | [config.lang.cancel] | String | "cancel" | |
32 | | [config.animateTime] | Number | 150 | |
33 | | [config.autoCloseTime] | Number | 0 | 0보다 크면 autoCloseTime 프레임후에 dialog auto close |
34 |
35 | **Example**
36 | ```
37 | var dialog = new ax5.ui.dialog();
38 | dialog.setConfig({
39 | title: "app dialog title",
40 | zIndex: 5000,
41 | onStateChanged: function () {
42 | if (this.state === "open") {
43 | mask.open();
44 | }
45 | else if (this.state === "close") {
46 | mask.close();
47 | }
48 | }
49 | });
50 | ```
51 |
52 |
53 | ### ax5dialog.alert(config, [callback]) ⇒ [ax5dialog](#ax5dialog)
54 | open the dialog of alert type
55 |
56 | **Kind**: static method of [ax5dialog](#ax5dialog)
57 |
58 | | Param | Type | Default | Description |
59 | | --- | --- | --- | --- |
60 | | config | Object | String | | dialog 속성을 json으로 정의하거나 msg만 전달 |
61 | | [config.theme] | String | "default" | |
62 | | [config.width] | Number | 300 | |
63 | | [config.title] | String | "" | |
64 | | [config.zIndex] | Number | | |
65 | | [config.onStateChanged] | function | | |
66 | | [config.lang] | Object | | |
67 | | [config.lang.ok] | String | "ok" | |
68 | | [config.lang.cancel] | String | "cancel" | |
69 | | [config.animateTime] | Number | 150 | |
70 | | [config.autoCloseTime] | Number | 0 | 0보다 크면 autoCloseTime 프레임후에 dialog auto close |
71 | | [config.additionalContent] | function | String | | |
72 | | [callback] | function | | 사용자 확인 이벤트시 호출될 callback 함수 |
73 |
74 | **Example**
75 | ```
76 | myDialog.alert({
77 | title: 'app title',
78 | msg: 'alert'
79 | }, function(){});
80 | ```
81 |
82 |
83 | ### ax5dialog.confirm(config, [callback]) ⇒ [ax5dialog](#ax5dialog)
84 | open the dialog of confirm type
85 |
86 | **Kind**: static method of [ax5dialog](#ax5dialog)
87 |
88 | | Param | Type | Default | Description |
89 | | --- | --- | --- | --- |
90 | | config | Object | String | | dialog 속성을 json으로 정의하거나 msg만 전달 |
91 | | [config.theme] | String | "default" | |
92 | | [config.width] | Number | 300 | |
93 | | [config.title] | String | "" | |
94 | | [config.zIndex] | Number | | |
95 | | [config.onStateChanged] | function | | |
96 | | [config.lang] | Object | | |
97 | | [config.lang.ok] | String | "ok" | |
98 | | [config.lang.cancel] | String | "cancel" | |
99 | | [config.animateTime] | Number | 150 | |
100 | | [config.autoCloseTime] | Number | 0 | 0보다 크면 autoCloseTime 프레임후에 dialog auto close |
101 | | [config.additionalContent] | function | String | | |
102 | | [callback] | function | | 사용자 확인 이벤트시 호출될 callback 함수 |
103 |
104 | **Example**
105 | ```
106 | myDialog.confirm({
107 | title: 'app title',
108 | msg: 'confirm',
109 | additionalContent: function () {
110 | return "[ax5dialog](#ax5dialog)
117 | open the dialog of prompt type
118 |
119 | **Kind**: static method of [ax5dialog](#ax5dialog)
120 |
121 | | Param | Type | Default | Description |
122 | | --- | --- | --- | --- |
123 | | config | Object | String | | dialog 속성을 json으로 정의하거나 msg만 전달 |
124 | | [config.theme] | String | "default" | |
125 | | [config.width] | Number | 300 | |
126 | | [config.title] | String | "" | |
127 | | [config.zIndex] | Number | | |
128 | | [config.onStateChanged] | function | | |
129 | | [config.lang] | Object | | |
130 | | [config.lang.ok] | String | "ok" | |
131 | | [config.lang.cancel] | String | "cancel" | |
132 | | [config.animateTime] | Number | 150 | |
133 | | [config.autoCloseTime] | Number | 0 | 0보다 크면 autoCloseTime 프레임후에 dialog auto close |
134 | | [config.additionalContent] | function | String | | |
135 | | [callback] | function | | 사용자 확인 이벤트시 호출될 callback 함수 |
136 |
137 | **Example**
138 | ```
139 | myDialog.prompt({
140 | title: 'app title',
141 | msg: 'alert'
142 | }, function(){});
143 | ```
144 |
145 |
146 | ### ax5dialog.close() ⇒ [ax5dialog](#ax5dialog)
147 | close the dialog
148 |
149 | **Kind**: static method of [ax5dialog](#ax5dialog)
150 | **Example**
151 | ```
152 | myDialog.close();
153 | ```
154 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | The MIT License (MIT)
2 |
3 | Copyright (c) 2013-2016 Thomas Jang, Brant and Team AXISJ
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in
13 | all copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21 | THE SOFTWARE.
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 
2 | [](https://badge.fury.io/js/ax5ui-dialog)
3 | [](https://www.npmjs.com/package/ax5ui-dialog)
4 |
5 | # ax5ui-dialog
6 | "dialog" displays information on a popup window and also enables users to enter input values.
7 |
8 | > *Dependencies*
9 | > * _[jQuery 1.X+](http://jquery.com/)_
10 | > * _[ax5core](http://ax5.io/ax5core)_
11 | > * _[bootstrap](http://getbootstrap.com/)_
12 |
13 |
14 | ### Install with bower
15 | ```sh
16 | bower install ax5ui-dialog
17 | ```
18 | [bower](http://bower.io/#install-bower) is web front-end package manager.
19 | When you install `bower`, it will be installed under the `bower_components` folder to resolve the plug-in dependencies.
20 | (You can change the folder location. [.bowerrc](http://bower.io/docs/config/#bowerrc-specification) )
21 |
22 | It is recommended that you install by using `bower`.
23 | If you've never used bower, please refer to [http://bower.io/#install-bower](http://bower.io/#install-bower).
24 |
25 | ### Install with npm
26 | If you do not use bower, it also can be installed by using npm as an alternative.
27 | In case of npm, which is the package manager for the front end, you need to solve the problem of plug-in dependencies.
28 |
29 | ```sh
30 | npm install jquery
31 | npm install ax5core
32 | npm install ax5ui-dialog
33 | ```
34 |
35 | After downloading the install file of npm, you will need to copy it to the location where you want to use as a resource for the project.
36 | If the copy process is inconvenient, it also can be done easily by using `gulp` or `grunt`.
37 |
38 | ### Download code
39 | - [ax5core Github releases](https://github.com/ax5ui/ax5core/releases)
40 | - [ax5ui-dialog Github releases](https://github.com/ax5ui/ax5ui-dialog/releases)
41 |
42 |
43 | ### Insert "ax5dialog" in HTML HEAD.
44 | Folder location can be any for your project. However, please be sure to assign the right path in the project.
45 |
46 | ```html
47 |
48 |
49 |
50 |
51 | ```
52 |
53 | **CDN urls**
54 | This is a list of CDN urls for ax5ui-dialog. ax5ui offers the CDN services through rawgit.
55 | ```
56 | https://cdn.rawgit.com/ax5ui/ax5ui-dialog/master/dist/ax5dialog.css
57 | https://cdn.rawgit.com/ax5ui/ax5ui-dialog/master/dist/ax5dialog.js
58 | https://cdn.rawgit.com/ax5ui/ax5ui-dialog/master/dist/ax5dialog.min.js
59 | ```
60 |
61 |
62 | ### Basic Usage
63 | ```js
64 | var myDialog = new ax5.ui.dialog({
65 | title: ' Default alert',
66 | onStateChanged: function(){
67 |
68 | }
69 | });
70 |
71 | $('#btn').click(function () {
72 | myDialog.alert({
73 | msg: 'Alert message'
74 | }, function () {
75 | console.log(this);
76 | });
77 | });
78 | ```
79 |
80 | * * *
81 |
82 | ### Preview
83 | - [See Demonstration](http://ax5.io/ax5ui-dialog/demo/index.html)
84 |
85 | If you have any questions, please refer to the following [gitHub](https://github.com/ax5ui/ax5ui-kernel)
86 |
87 | ## Question
88 | - https://jsdev.kr/c/axisj/ax5ui
89 | - https://github.com/ax5ui/ax5ui-kernel/issues
90 |
91 | [](https://github.com/axisj)
92 | 
--------------------------------------------------------------------------------
/bower.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "ax5ui-dialog",
3 | "version": "1.4.131",
4 | "description": "A dialog plugin that works with Bootstrap & jQuery",
5 | "authors": [
6 | "ThomasJ {{#_crlf}}{{.}}{{/_crlf}}
\n {{/@value.help}}\n{{#_crlf}}{{.}}{{/_crlf}}
\n {{/@value.help}}\n{{#_crlf}}{{.}}{{/_crlf}}
\n {{/@value.help}}\n{{#_crlf}}{{.}}{{/_crlf}}
25 | {{/@value.help}} 26 |