1 / 5

JSF File Upload Control

JSF File Upload Control. This Learning Module describes the use of the JSF File Upload component – for allowing users to select and save images to blobs and clobs through Server-Side EGL programming.  File Upload Control – 1 of 4.

kimo
Télécharger la présentation

JSF File Upload Control

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. JSF File Upload Control This Learning Module describes the use of the JSF File Upload component – for allowing users to select and save images to blobs and clobs through Server-Side EGL programming.

  2.  File Upload Control – 1 of 4 • Many leading-edge applications have requirements to display, save and manipulate graphic files. You’ve seen that JSF Image components can be used to display graphics. However, it is a common requirement to allow users to update them through the browser. To do this, we introduce you to the File Upload component. Let’s have a look! • Create a new web .JSP page named: fileUpdatePage.jsp – use a Style Template. • Drag an HTML table into the page: 4 Rows/2 columns. Width: 60% • In column 1, add the text shown in this screen capture. • Optionally, select the column horizontally align right, give the column a custom color, and make the text smaller and bold • In row 1, column 2 drag/drop an Enhanced Faces Component Images control • In row 2, column 2 drag/drop a File Upload control

  3.  File Upload Control – 2 of 4 - JSFHandler • From the JSFHandler, replace the existing boilerplate code with the statements in the Notes section. Let’s have a look and see what’s new in here… • The fileNameIn/Out string variables will be used to load a blob variable from an image file on your machine. This blob value (image) could come from a database as well • The LOBLIB. Is a set of EGL API’s that provide useful functions for manipulating blobs. In our case, we are using: • loadBlobFromFile – which uses the filespec associated with the fileNameIn variable to initialize the blob variable • updateBlobToFile – which writes out a new file, from the value in the blob variable • Be sure to Ctrl/S (save) before continuing

  4.  File Upload Control – 3 of 4 Bind Variables From Page Designer: • Select the Image file • From Properties • Specify File: • From the folder icon, select Bind... • Choose the img blob from Page Data • Specify Type: image/gif • From Page Data • Drag and Drop img blob on top of the FileUpload Control • Drag and Drop changeImg into the HTML table – where it will create a Submit Button • Drag and Drop writeBlobToFile into the HTML table – where it will create a Submit Button

  5.  File Upload Control – 4 of 4 Prepare for the test • Recall that in the JSFHandler the filespec pointed to: c:/r1.jpg. You will need to: • From \WebContent\images: • Select and Copy the r1.jpg file • From Windows Explorer or My Computer paste the file directly onto the C: (root) drive • Run the page and try out the: Upload, Change and Write buttons • Note that after clicking writeBlobToFile – you can use the Browse… button to go see it, as: c:/r1bk.jpg

More Related