templates Array
(default: [])
Describes the HTML markup of the different notification types as Kendo UI template strings. The built-in types are "info"
, "success"
, "warning"
and "error"
.
This documentation section assumes that you are familiar with Kendo UI templates.
Example - define several custom templates
<span id="notification"></span>
<script id="myAlertTemplate" type="text/x-kendo-template">
<div class="myAlert">System alert generated at #= time # : #= myMessage #</div>
</script>
<script>
$(function(){
var notificationElement = $("#notification");
notificationElement.kendoNotification({
templates: [{
// define a custom template for the built-in "warning" notification type
type: "warning",
template: "<div class='myWarning'>Warning: #= myMessage #</div>"
}, {
// define a template for the custom "timeAlert" notification type
type: "timeAlert",
template: "<div class='myAlert'>System alert generated at #= time # : #= myMessage #</div>"
// template content can also be defined separately
//template: $("#myAlertTemplate").html()
}]
});
var n = notificationElement.data("kendoNotification");
// show a warning message using the built-in shorthand method
n.warning({
myMessage: "some warning message here"
});
// show a "timeAlert" message using the default show() method
n.show({
time: new Date().toLocaleTimeString(),
myMessage: "Server will be restarted."
}, "timeAlert");
});
</script>
templates.type String
(default: "")
Required. Specified a unique identifier, which is used to retrieve the correct template when a notification of this type is shown.
See the example above.
templates.template String
(default: "")
Defines a Kendo UI template to be used with the corresponding notification type.
See the example above.