Skip to content
A simple jQuery plugin that uses the Kendo UI info and error css classes to display info and error messages.
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
demo
dist
src
.gitattributes
.gitignore
Gulpfile.js
LICENSE
README.md
bower.json
kendo.message.nuspec
package.json

README.md

jQuery Kendo Message

A simple jQuery plugin that displays info and error messages.

Build status

You can install with NuGet:

Kendo Message on NuGet http://nuget.org/List/Packages/Kendo.Message

PM> Install-Package Kendo.Message

Or install with Bower:

Bower version

> bower install kendo.message

Usage

Options

All options are optional.

option values default description
message any text or html inner html of the matched element the message
type info, error info the type of message
dismiss true, false true if true, "Click to dismiss" is appended to the message and clicking it will hide the message

Methods

method arguments description
show none shows the message
hide none hides the message
options options changes the options
destroy none restores the matched element to the state it was in before the message plugin was applied

Examples

<script type="text/javascript">
    $(document).ready(function()
    {
        $("#message1").message();
        $("#message2").message({type:"error"});
        $("#message3").message({type:"info", message:"Here's an info message with dynamic content."});
        $("#message4").message({dismiss: false});
        $("#message5").message();
        $("#message6").message({dismiss: false});
        
        $("#message5-button").click(function()
        {
            $("#message5").message('options', {type:"error", message:"Error"});
        });
        
        $("#message6-hide").click(function()
        {
            $("#message6").message("hide");
        });
        
        $("#message6-show").click(function()
        {
            $("#message6").message("show");
        });
    });
</script>
<div id="message1">Here's an info message.</div>
<div id="message2">Here's an error message.</div>
<div id="message3"></div>
<div id="message4">Here's an info message without dismiss.</div>
<div>
    <div id="message5">Click the following button to change this to an error.</div>
    <button id="message5-button">Change to Error</button>
</div>
<div>
    <div id="message6">Click the following buttons to show or hide.</div>
    <button id="message6-hide">Hide</button>
    <button id="message6-show">Show</button>
</div>

Demo

You can’t perform that action at this time.