CFileBrowserWidget
This is a widget that will render a file browser on the page
Installation and Usage
The Controller Action
The widget relises on a 'connector' that gets called via AJAX requests to display a folders contents. You can cut and paste the code in ControllerActionSample.php into the controller of your choice.
The widget
Place all the widget file in the extensions folder of your application and call the widget in your page like this:
$this->widget('application.extensions.cfilebrowser.CFileBrowserWidget',array(
'script'=>array('site/filebrowser'),
'root'=>'/var/',
'folderEvent'=>'click',
'expandSpeed'=>1000,
'collapseSpeed'=>1000,
'expandEasing'=>'easeOutBounce',
'collapseEasing'=>'easeOutBounce',
'multiFolder'=>true,
'loadMessage'=>'File Browser Is Loading...hang on a sec',
'callbackFunction'=>'alert("I selected " + f)'
));
This will then render the following code in your file
<div id="filebrowser"></div>
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function() {
jQuery('#filebrowser').fileTree({
root:'/var/',
script:'/index.php?r=site/filebrowser',
folderEvent:'click',
expandSpeed:1000,
collapseSpeed:1000,
multiFolder:true,
loadMessage:'File Browser Is Loading...hang on a sec',
expandEasing:'easeOutBounce',
collapseEasing:'easeOutBounce'
}, function(f){
alert("I selected " + f);
});
});
//]]>>
</script>
Widget Options
- script - (required) The connector. You must specify as an array e.g. 'array("site/filebrowser")'
- root - The location to start from (default: '/')
- folderEvent - The event to expand a folder (default: 'click')
- expandSpeed - Time in miliseconds (default: 500)
- collapseSpeed - Time in miliseconds (default: 500)
- callbackMethod - Where 'f' is the file selected
- expandEasing - (optional)The easing method
- collapseEasing - (optional) The easing method
- loadMessage - (optional) Specify your own message
- containerID - (optional) Specify your own div id (default: 'filebrowser')
- cssFile - (optional) Specify your own CSS file or set as false for none