Kendo Action Sheet plugin syntax

by kendomobile

HTML

<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.mobile.all.min.css">
<!-- Demo created for the book: Building Mobile Applications Using Kendo UI Mobile andASP.NET Web API.
http://www.packtpub.com/building-mobile-applications-with-kendoui-html5/book -->
<div data-role="view" data-init="initialize" >   
    
   <a data-role="button" id="btnShare" data-rel="actionsheet" 
      href="#confirmationSheet">Share</a>
     <!-- div to write output--->
       <div id="output"> </div>
    
    <ul 
        id="confirmationSheet">
            
        <li>
            <a data-action="shareOnTwitter">
                Twitter
            </a>
        </li>
        <li>
            <a data-action="shareOnFB">
                Facebook
            </a>
        </li>
        <li>
            <a data-action="justEmail">
                Email
            </a>
        </li>
            
    </ul>
    
</div>

JavaScript

var app = new kendo.mobile.Application(document.body);

function initialize(){  
     
    $("#confirmationSheet").kendoMobileActionSheet();
}

function shareOnTwitter(e){
   output('twitter...'); 
   output(e.target);
}

function shareOnFB(e){
    output('FB...'); 
    output(e.target);
    
}

function justEmail(e){
    output('Email...'); 
   output(e.target);
    
}

function output(data){
    $("#output").append(data);
    $("#output").append("<br/>");    
}