Template:Accordion2

    Table of contents
    No headers
    // Parameters:
    //    id (required):  The unique id to be assigned to this accordian (Must start with #)
    //    content (required):  A list of maps containing the title and value for each section of the accordian.
    //    options (optional):  Customizable options per the follwoing web site: http://jqueryui.com/demos/accordion/
    //              NOTE:  The header option should not be used it is automatically appended.
    /*
     EXAMPLE: 
    {{ template.accordion{
                         id:'#myid1', 
                         content:[{title: 'My First Test', value:'My New Value'} ,
                                  {title: 'My Other First Test',value:'My Other New Value'}] ,
                         options: {collapsible: true, autoHeight: false, active:false} 
                         } 
    }}
    */
    
    dekiapi();
    
    var accordid = ($id ?? $0 ?? '#accordian');
    var cnts = ( $content ?? $1 ?? [ { title: 'Title 1', value: 'Value 1' } , { title: 'Title 2', value: 'Value 2' } ] );
    var opts = ( $options ?? $2 ?? {collapsible: true, autoHeight: false, active:false} );
    let opts ..= {header: 'dd'};
    var aid = string.replace(accordid, '#', '');
    
    <div id=(aid)>;
    foreach(var itm in cnts) {
    <dd><a href="#">; itm.title; </a></dd>;
    <div><span>; itm.value; </span></div>;
    }
    </div>;
    
    <html><head>;
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.base.css" rel="stylesheet" />
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.core.css" rel="stylesheet" />
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.theme.css" rel="stylesheet" />
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.accordion.css" rel="stylesheet" />
      <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
      <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
      <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.accordion.js"></script>
      <script type="text/javascript">"
      $(document).ready(function(){
        $('"..accordid.."').accordion("..JSON.emit(opts)..");
      });
      "</script>
    </head></html>;
    Tag page
    You must login to post a comment.

    Copyright © 2011 MindTouch, Inc. Powered by