Location Chooser provides a way of choosing the location of files from the desktop. The widget uses Prototype library and implements DWR (Direct Web Remoting) to get data. Use the File Chooser to select files from the desktop.
No dependencies. The
File Chooser Widget depends on the Location Chooser Widget.
- Select the location on your desktop through this widget.
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 src='/dekohportal/dwr/engine.js'>
</script>
<script src='/dekohportal/dwr/util.js'>
</script>
<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","locationChooser","locationchooserdialog.js")%>">
</script>
<script type="text/javascript" src="<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "widget","locationChooser","locationchooser.js")%>">
</script>
<script type="text/javascript" src="<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request, "widget","dialog","dialog.js")%>">
</script>
<script src='/dekohportal/dwr/interface/locationchooser.js'>
</script>
The basic syntax to initialize the Dialog widget is
<script type="text/javascript">
function handleLocationChooserOnClose(gDialogId, returnValue, servletUrl)
{
alert('selected folder is '+returnValue);
}
</script>
Include the following code where you want to invoke the Location Chooser in page:
<input type="button" value="Select" class="dekoh_button" onclick="javascript:new LocationChooserDialog('dialog_ID',null,{fileSeparator:'\\'});"/>
Embedding the Location Chooser in the page
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 src='/dekohportal/dwr/engine.js'>
</script>
<script src='/dekohportal/dwr/util.js'>
</script>
<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","dialog","dialog.js")%>">
</script>
<script type="text/javascript" src="<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request,"widget","fileChooser","fileChooserDialog.js")%>">
</script>
<script type="text/javascript" src="<%=dekoh.portal.util.StaticFilesURLGenerator.generateStaticFileURL(request,"widget","locationChooser","locationchooser.js")%>">
</script>
The basic syntax to initialize the location chooser as an embedded widget in a page:
<script type="text/javascript">
function openLocationDialog()
{
new LocationChooser('locationChooserEmbedded','',{fileSeparator:"\\"});
}
</script>
Include the following code in the jsp/ html/ php page
<div id="locationChooserEmbedded"></div>
<input type="button" value="Select Files" onclick="javascript:openLocationDialog();"/>
| Options | Since | Description | Default |
|---|
| Id | V1.0 | Dialog Id | - |
| Options | Since | Description | Default |
|---|
| fileSeperator | V1.0 | This value is to be initialized for different operating systems | ‘
’ |
| Function | Parameters | Description |
|---|
| initLC | dialogId, bDontSetStatus, sFileSeparator | - |
| createAddBookmark | - | Add bookmark for the location |
| removeAddBookmark | - | - |
| checkBookmarkForDelete | bookmarkListObj,strFileSeparator | - |
| handleDeleteBookMark | currentBookmarkTxt | - |
| handleNewBookmarkName | - | - |
| createTree | targetEle, fullTree, bChildDirCall, marginLeft, currentEleObjRef, strFileSeparator | - |
| isBookmarked | pathname, bookmarks, strFileSeparator | - |
| resetBookmarksSelectBox | - | - |
| checkCurrentfolderBookmark | currFolder | - |
| getAllBookmarks | rootDirectories | - |
| sortSelect | obj | - |
| setActiveNode | - | - |
| createNewFolder | - | - |
| trimCurrentPathText | strPath | - |
| setCurrentLocation | strPath | - |
| validateNewFolderName | txtBox | - |
| setBookmark | Dirname, Bookmark, sFileSeparator | - |
| bookmarkSelected | xcurrentFolder, dialogId, strFileSeparator | - |
| makeDirName | Prefix, suffix | - |
| selectFolder | servletUrl | - |
| Options | Since | Description | Default |
|---|
| Id | V1.0 | Dialog Id | - |
| Options | Since | Description | Default |
|---|
| className | V1.0 | The style class | Dekoh |
| headerMsg | V1.0 | The message shown on the dialog | 'Select location on your desktop' |
| fileSeperator | V1.0 | This value is to be initialized for different operating systems | '
' |
| title | V1.0 | Set the title here | ‘File Chooser’ |
| width | V1.0 | Width of the dialog | 600 |
| height | V1.0 | Height of the dialog | 450 |
| xPos | V1.0 | Specify the x position of the dialog in the document | 0 |
| yPos | V1.0 | Specify the y position of the dialog in the document | 0 |
| resizable | V1.0 | Set whether the dialog is resizable or not | false |
| minimizable | V1.0 | Works with resizable value set to ‘true’. The value defined for this is ‘true’ or ‘false’ depends on whether you want to make dialog minimized | False |
| maximizable | V1.0 | Works with resizable value set to ‘true’. The value defined for this is ‘true’ or ‘false’ depends on whether you want to make dialog maximized | False |
| isModal | V1.0 | Specify whether the dialog is modal or not | true |
Reference in web.xml
<init-param>
<param-name>config-locationChooser</param-name>
<param-value>widgets/locationChooser/dwr-locationchooser.xml</param-value>
</init-param>
<dwr>
<allow>
<create creator="new" javascript="locationchooser">
<param name="class" value="dekoh.dekohportal.widget.locationchooser.LocationChooserUtil"/>
<include method="getRootDirectories"/>
<include method="saveLocationBookMark"/>
<include method="saveFileBookMark"/>
<include method="getAllLocationBookMarks"/>
<include method="getAllFileBookMarks"/>
<include method="getLocationBookMark"/>
<include method="getFileBookMark"/>
<include method="getCurrentFolderTree"/>
</create>
<convert converter="bean" match="dekoh.dekohportal.widget.locationchooser.LocationObject"/>
<convert converter="bean" match="dekoh.dekohportal.widget.locationchooser.BookMarkObject"/>
</allow>
</dwr>
Each class on which we execute methods, needs a <create ...> entry. There are several types of creator. The most common ones use either the 'new' keyword or the Spring framework. For more information, see the Creator documentation.
| Method Name | Functionality |
|---|
| getRootDirectories | - |
| saveLocationBookMark | - |
| saveFileBookMark | - |
| getAllLocationBookMarks | - |
| getAllFileBookMarks | - |
| getLocationBookMark | - |
| getFileBookMark | - |
| getCurrentFolderTree | - |
We need to ensure that all the parameters can be converted. Many of the types provided by the JDK are enabled for you, but you need to give DWR permission to convert your own code. Generally this means that JavaBean parameters will need a <convert ...> entry.
Dekoh Portal Ver 0.4.2 or later.
