Alert7.js

The pure JavaScript plugin. Create the iOS style alerts simply.

Usage

Include file of Alert7.js

Include alert7.js file.

<script src="alert7.js"></script>

Or minify file with alert7.min.js.

<script src="alert7.min.js"></script>

There has two ways to execute Alert7.js.

Create static Alert7

Just use Alert7.alert method with title attribute. In the moment, There will appear a basic alert with a default button. And return an Alert7-Object. Click button what without handler will just close the alert.

Alert7.alert("This is Title");

Add content text attribute and change the button letter with third attribute.

Alert7.alert("This is Title", "Put some text contents in here", "Got it");

Or incloud button handler in the next attribute. Alert will disappear when any button handler completed.

Alert7.alert("This is Title", "Put some text contents in here", "Got it", function () {});

Append any amount of action buttons.

Alert7.alert("This is Title", "Put some text contents in here", 
	"BUTTON 1", function () {}, 
	"BUTTON 2", function () {}, 
	"BUTTON 3"
);

To launch a simple confirm with using Alert7.confirm method. And return an Alert7-Object too.

Alert7.confirm("This is Title", "Put some text contents in here", 
	"BUTTON 1", function () {}, 
	"BUTTON 2", function () {}
);

New Alert7-object

Use new to create an Alert7-Object.

var a7Alert = new Alert7();

Set title of the Alert7-Object.

a7Alert.title = "This is Title";

a7Alert.setTitle("This is Title");

Set text messages of the Alert7-Object.

a7Alert.message = "Put some text contents in here";

a7Alert.setMessage("Put some text contents in here");

Add action button to the Alert7-Object.

a7Alert.addAction("Got it");

a7Alert.actions.push({
	title: "Got it"
});

With handler.

a7Alert.addAction("Got it", function () {});

a7Alert.actions.push({
	title: "Got it",
	handler: function () {}
});

Or set multiple actions with a command with Array.

a7Alert.actions = [{
	title: "BUTTON A",
	handler: function () {}
}, {
	title: "BUTTON B",
	handler: function () {}
}, {
	title: "BUTTON C"
}];

Present the Alert7-Object.

a7Alert.present();

Change type for confriming with Alert7 type enumerations. (Enumerations with Consts section)

a7Alert.type = Alert7.TYPE_CONFIRM;

a7Alert.setType(Alert7.TYPE_CONFIRM);

Present it. Confirm Alert7 only has two actions at most.

All of action button will close the alert. But it can be broken by called Alert7.break method in handler.

function () {
	Alert7.break();
}

Methods

Alert7.alert

Appear an alert of Alert7 and return Alert7-Object.

_a7Obj = Alert7.alert( _titleStr, _messageStr,
	_btn1Str, _btn1Handler,
	_btn2Str, _btn2Handler,
	...	
)

parameter: _titleStr:String, _messageStr:String, _btn1Str:String, _btn1Handler:Function... / return: _a7Obj:Alert7Object

---

Alert7.confirm

Appear an confirm of Alert7 and return Alert7-Object.

_a7Obj = Alert7.confirm( _titleStr, _messageStr,
	_btn1Str, _btn1Handler,
	_btn2Str, _btn2Handler
)

parameter: _titleStr:String, _messageStr:String, _btn1Str:String, _btn1Handler:Function... / return: _a7Obj:Alert7Object

---

Alert7.break

Prevent closing alert when an action button is clicked. It can only use at handler Function.

Alert7.break()

---

setTitle

Set title of Alert7-Object.

_a7Obj.setTitle( _titleStr )

parameter: _a7Obj:Alert7Object, _titleStr:String

---

setMessage

Set message of Alert7-Object.

_a7Obj.setMessage( _messageStr )

parameter: _a7Obj:Alert7Object, _messageStr:String

---

setType

Set type of Alert7-Object with type enumerations.

_a7Obj.setType( _typeEnum )

parameter: _a7Obj:Alert7Object, _typeEnum:Number (Enumerations with Consts section)

---

addAction

Append an action button for Alert7-Object and what will be handled.

_a7Obj.addAction( _text, _handler )

parameter: _a7Obj:Alert7Object, _text:String, _handler:Function

---

present

Present and show the alert of Alert7-object.

_a7Obj.present()

parameter: _a7Obj:Alert7Object

---

dismiss

Disappear the alert of Alert7-object.

_a7Obj.dismiss()

parameter: _a7Obj:Alert7Object

---

Values

title

Title of the Alert7-Object.

type: String

---

message

Message of the Alert7-Object.

type: String

---

type

Type of the Alert7-Object with type enumerations.

type: Number (Enumerations with Consts section)

---

actions

JSON list of action data of the Alert7-Object.

type: Array

---

Consts

Alert7.TYPE_DEFAULT

Type default enumerations.

type: Number

---

Alert7.TYPE_CONFIRM

Type confirm enumerations.

type: Number

---

Examples

• Basic

Todo

• Some methods to change style.
• Incloud inputs.
• Incloud template HTML.

License

Released under the MIT license.