Inline Tray Widget

Inline Tray Widget is based on the prototype javascript library.

Dependency

Depends on Message Tray

Features

  • Support key input for closing and enter
  • Support to create inline menu
  • Support for the advanced option

How to use

Add this code to the head section of the page:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<style type="text/css" title="currentStyle" media="screen">
  @import '<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "theme","app","css.jsp?externalApp=true")%>';
</style>
<script type='text/javascript' src='<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "common",null,"JSlibrary.jsp")%>'>
</script>
<script type='text/javascript' src='<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "widget","messageTray","messageTray.js")%>'>
</script>
<script type='text/javascript' src='<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "widget","inlineTray","inlineTray.js")%>'>
</script>

JavaScript code

The basic syntax to initialize the Dialog widget is
function openInlineTray(elementId){
var inlineTrayContent="Here is the content";
var oinlineTray = new inlineTray('InlineTray_Id', {title:'My Sample Inline Tray',content:inlineTrayContent, clickedElementId:elementId});
}

HTML code

Include the following code where you want to invoke the File Chooser in page:


<div style="border:1px #333 solid;padding:10px;background:#eee;cursor:pointer;" onclick="openInlineTray(this);">Click to Open inline tray</div>

Parameters for initializing the widget

Required parameters

OptionsSinceDescriptionDefault
IdV1.0Inline tray Id-

Optional parameters

OptionsSinceDescriptionDefault
titleV1.0The title of the inline traynull
contentV1.0Html Contentnull
clickedElementIdV1.0The element id where the inline tray is to be initialized null
widthV1.0Set the tray width300
advancedOptionLinkV1.0Set the link for advance options. This could be url or js functionnull
isAdvancedOptionLinkJSV1.0Set the value as true or false for js functiontrue

Functions

FunctionParametersDescription
setStatustype:set the type of message eg ‘error’,’waiting’and ’info’, message:the message ContentSet the message on the inline tray
closeInlineMenu-Closes the inline Menu
createInlineMenudata: array of menuObj, elementId: the element where the menu is going to get createdCreate inline menu

Availability

Dekoh Portal Ver 0.4.2 or later.

Attachments

inlinetray_widget.jpg Info on inlinetray_widget.jpg 37970 bytes