We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 28042 ☆ A M B ☆
    • 24,524 Posts
    Here’s how to add the Resource Browser to a form; in this case to deal with uploading PDF files for download. Of course, this is a very simplistic method and does not provide security for the files, but then your average brochure site providing PDF newsletters or other material is not going to be too unhappy about people getting these files.
    <!-- File Browser -->
    <script type="text/javascript">
    		function OpenServerBrowser(url, width, height ) {
    			var iLeft = (screen.width  - width) / 2 ;
    			var iTop  = (screen.height - height) / 2 ;
    
    			var sOptions = 'toolbar=no,status=no,resizable=yes,dependent=yes' ;
    			sOptions += ',width=' + width ;
    			sOptions += ',height=' + height ;
    			sOptions += ',left=' + iLeft ;
    			sOptions += ',top=' + iTop ;
    
    			var oWindow = window.open( url, 'FCKBrowseWindow', sOptions ) ;
    		}			
    		function BrowseServer() {
    			var w = screen.width * 0.7;
    			var h = screen.height * 0.7;
    			OpenServerBrowser('/manager/media/browser/mcpuk/browser.html?Type=files&Connector=/manager/media/browser/mcpuk/connectors/php/connector.php&ServerPath=/your/server/path/assets/', w, h);
    		}
    		
    			function SetUrl(url, width, height, alt){
    			    document.getElementById('nlFile').value = url;
    			}
    </script>
    
    			<label for="nlFile">Select PDF File:</label>
    			<input type="text" id="nlFile" name="longtitle"  value="[+longtitle+]" /> <input type="button" value="Select PDF File" onclick="BrowseServer()" />
    
    <!-- End File Browser -->
    

    As you can see, your input has an ID that matches that in the last line of the javascript. To do images, just change the ’type=files’ to ’type=images’ in the OpenServerBrowser parameter. Make sure to use your correct file system path for the ServerPath; you can get this from looking in your site’s configuration under the File Manager tab.

    Of course, it is up to your form processing script to handle the field; in this case I was using the PubKitBlog snippet set, and it was easier to use the longtitle field, which is a required field in PubKit anyway.
      Studying MODX in the desert - http://sottwell.com
      Tips and Tricks from the MODX Forums and Slack Channels - http://modxcookbook.com
      Join the Slack Community - http://modx.org