Inline Tray Widget is based on the prototype javascript library.
Depends on
Message Tray
- Support key input for closing and enter
- Support to create inline menu
- Support for the advanced option
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>
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});
}
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>
| Options | Since | Description | Default |
| Id | V1.0 | Inline tray Id | - |
| Options | Since | Description | Default |
| title | V1.0 | The title of the inline tray | null |
| content | V1.0 | Html Content | null |
| clickedElementId | V1.0 | The element id where the inline tray is to be initialized | null |
| width | V1.0 | Set the tray width | 300 |
| advancedOptionLink | V1.0 | Set the link for advance options. This could be url or js function | null |
| isAdvancedOptionLinkJS | V1.0 | Set the value as true or false for js function | true | |
| Function | Parameters | Description |
| setStatus | type:set the type of message eg ‘error’,’waiting’and ’info’, message:the message Content | Set the message on the inline tray |
| closeInlineMenu | - | Closes the inline Menu |
| createInlineMenu | data: array of menuObj, elementId: the element where the menu is going to get created | Create inline menu |
Dekoh Portal Ver 0.4.2 or later.