Skip to content

Usage Example

rudmanmrrod edited this page Jul 4, 2017 · 1 revision

Alert

Usage Example

MaterialDialog.alert(
	'Message', // Alert Body (Acepts html tags)
	{
		title:'Alert Modal', // Modal title
		buttons:{ // Receive buttons (Alert only use close buttons)
			close:{
				text:'close', //Text of close button
				className:'red', // Class of the close button
				callback:function(){ // Function for modal click
					alert("hello")
				}
			}
		}
	}
);

Dialog

Usage Example

MaterialDialog.dialog(
	"Text here",
	{
		title:"Dialog Title",
		modalType:"modal-fixed-footer", // Can be empty, modal-fixed-footer or bottom-sheet
		buttons:{
			// Use by default close and confirm buttons
			close:{
				className:"red",
				text:"closed",
				callback:function(){
					alert("closed!");
				}
			},
			confirm:{
				className:"blue",
				text:"confirmed",
				modalClose:false,
				callback:function(){
					console.log("confirmed");
				}
			}
		}
	}
);

Extra

In options part, you can pass any materialize modal property's

MaterialDialog.alert(
	'Message', // Alert Body (Acepts html tags)
	{
		title:'Alert Modal', // Modal title
		dismissible: true, // Modal can be dismissed by clicking outside of the modal
		opacity: .5, // Opacity of modal background
		inDuration: 300, // Transition in duration
		outDuration: 200, // Transition out duration
		startingTop: '4%', // Starting top style attribute
		endingTop: '10%', // Ending top style attribute
		ready: function(modal, trigger) { // Callback for Modal open. Modal and trigger parameters alert("Ready");
			console.log(modal, trigger);
		},
		complete: function() { alert('Closed'); } // Callback for Modal close
	}
);
Clone this wiki locally