23

APEX Plugin – Multiple File Upload

Today I’m releasing the RC1 (Release Candidate 1) version of my commercial File Upload Item Plugin. The plugin supports the multiple selection and uploading of files from a single file browse with the addition of drag & drop support for browsers that support HTML5. It also provides backwards compatibility for non HTML5 browsers by allowing multiple files to be uploaded one by one without submitting the page. The plugin is compatible with modplsql & the PLSQL gateway.

The plugin supports 4 events which can be used in combination with dynamic actions e.g. refreshing a report once a file upload is complete. Here’s a recorded demonstration of the plugin in action.

You can also demo the plugin on apex.oracle.com and view the documentation here.

Finally I’m making a obfuscated RC1 version available for download and testing from apex-plugin.com as I’m hoping to gather some useful feedback before the final product release to accommodate any tweaks or enhancement requests. So please download and test it out for me if it’s something you think you might use in the future.

Please Note: using the plugin in production will require the purchase of an appropriate license.

  1. Sergej says:

    Script “plsql.sql” does not work. Warning: Package body created with compilation errors

    • mnolan says:

      Hi Sergej

      There is known problem with the wrapped PLSQL with the following characterset: AL32UTF8. Is this the characterset of your database?

      You can test it out in your own workspace on apex.oracle.com in the interim.

      Thanks
      Matt

  2. albert says:

    Hi,

    everything is working but every upload FAILS.
    Hope you can help.

    thanks

    Albert

    • mnolan says:

      Hi Albert

      What browser are you using and what database version & HTTP server?

      Try running the page in debug mode and open firebug at the same time. You should be able to get diagnostic information which can help pinpoint the problem area. Also try downloading the new version which I released the other day as that should add additional debug info.

      Make sure you table details are defined correctly in the plugin config, including checking additional columns not specified which might be not null etc.

      Finally for larger files when using a browser with HTML5 support which allows multiple file uploads, make sure PLSQLMaxParameters is set to a high enough value, as the file is base64 encoded and split into 4K chunks. Note: for more info on this it’s under the FAQ section “HTTP-400 Bad Request?” in the plugin documentation.

      Cheers
      Matt

  3. albert says:

    Hi,

    now I can upload Files. This is great. But I wand also download files direct from my table.
    here are my options:
    Target: Page in this App
    Page 31
    Item1 P31_File_upload
    Value: #DATEN_ID#
    When i click the link it only refresh the site.
    is this correct?

    thanks for anything

    Albert

  4. Sinardy says:

    Hi mnolan,

    I have a demo with that using a report to allow user to quickly view and delete the uploaded file, the report is list all the uploaded files, have Dynamic Action that refresh the report whenever it is deleted and have another action that refresh the plugin it was not able to refresh and it always show the old information of deleted file.

    Is the item refresh able?

    Thanks

    • mnolan says:

      Hi Sinardy,

      Apologies for the delay in replying. Unfortunately the item is not refreshable, but I may consider looking at adding this in a future release.

      In the interim if you need to remove a deleted file from the upload list you could use something simuilar to the following…

      var filename = “you need to define your filename somewhere”;
      apex.jQuery(“.qq-upload-list span”).each(function(item, index) {
      if(this.innerHTML === filename) $(this).parents(“li”).remove();
      });

      Cheers
      Matt

  5. Omar Sawalhah says:

    Hi Matt,
    Great work, I am testing the demo now, but I need to know If I can add additional field to enable the user to choose the File Type {‘CV’,'Photo’,'Work Expirience’,….}, so I can distinguish each file, since we have the option to upload multiple files.

    Regards,
    Omar

  6. Akis says:

    Hi Matt,

    You saved me many many hours of file upload work. THANKS.
    I had a problem uploading large files (19M Zip). After increasing the PLSQLMaxParameters to 10000 the plugin behavior changed. It doesn’t raise the HTP-400 error, but on the second AJAX post fails with and 404-not found error. Is there anything else I can do?

    Regards,
    Akis

    • mnolan says:

      Hi Akis

      I’m not sure what the problem is, you will need to look at your web servers log files which should point you in the right direction.

      Perhaps 10000 might not be enough as files get about 30% bigger on average due to base64 and URL encoding.

      Ideally though, the plugin is designed for smaller files because of the mod_plsql and APEX limitations.

      Cheers
      Matt

  7. Philip says:

    Hi mnolan,

    I’ve been playing with your plugin for 2 days now, and I can’t seem to make a validation out of it. What I wanted to do is to have a validation that will check if the file is duplicate or not. Currently, I have no luck in doing that. Any ideas? Thank you!

    • mnolan says:

      Hi Phillip

      Unfortunately it’s not possible within the plugin itself. But you could bind a dynamic action to the completion event and run some PLSQL code to either remove the duplicates or return a list to the user and give them the option what to do.

      Cheers

  8. ESVK says:

    Does this plgin work with APEX 4..1? I get the following error when tryingto run the page after creating an item witht the plugin.

    Error in PLSQL code raised during plug-in processing.
    ORA-06550: line 4, column 46: PLS-00201: identifier ‘PLUGIN_JQUERY_FILE_UPLOAD.PLUGIN_RENDER’ must be declared ORA-06550: line 4, column 1: PL/SQL: Statement ignored

    Technical Info (only visible for developers)•is_internal_error: true
    •apex_error_code: WWV_FLOW_PLUGIN_ENGINE.RUN_PLSQL_ERR
    •ora_sqlcode: -6550
    •ora_sqlerrm: ORA-06550: line 4, column 46: PLS-00201: identifier ‘PLUGIN_JQUERY_FILE_UPLOAD.PLUGIN_RENDER’ must be declared ORA-06550: line 4, column 1: PL/SQL: Statement ignored
    •component.type: APEX_APPLICATION_PAGE_ITEMS
    •component.id: 677404924413709803
    •component.name: P1_X
    •error_backtrace: ORA-06512: at “SYS.DBMS_SYS_SQL”, line 1926
    ORA-06512: at “SYS.WWV_DBMS_SQL”, line 966
    ORA-06512: at “SYS.WWV_DBMS_SQL”, line 992
    ORA-06512: at “APEX_040100.WWV_FLOW_DYNAMIC_EXEC”, line 649
    ORA-06512: at “APEX_040100.WWV_FLOW_PLUGIN_ENGINE”, line 858

    • mnolan says:

      Hi

      Did you install the plsql.sql file provided in the zip file? If so can you try compiling the PLUGIN_JQUERY_FILE_UPLOAD package and let me know what errors you receive.

      Thanks

      • ESVK says:

        Hi Matt,
        Thanks for your reply. You are correct. I overlooked installation step 9 in the README.txt The plugin is working great now! I will buy a license as soon as I am sure we are going to use it. Thanks again.

  9. Marc says:

    Hi Matt –
    I’ve been working with this plugin and got it to do the multiple file upload no problem. The only issue I’m currently having is regarding the foreign key column/value not being set in the attachments table.

    I have created a page item that holds the foreign key value: P1_ATTACH_PK_ID. Typically, this would be a hidden field but I’m displaying it for testing purposes.

    I’ve defined the file upload item as follows:

    Table Name QMS_ATTACHMENTS
    Filename Column ATTACH_FILENAME
    Mime Type Column ATTACH_MIMETYPE
    File Size Column ATTACH_FILESIZE
    BLOB Column ATTACH_DATA
    Primary Key Column ATTACH_ID
    Foreign Key Column ATTACH_PK_ID
    Foreign Key Page Item P1_ATTACH_PK_ID

    I switched on debug and that shows:
    0.02918 0.03292 …Execute Statement: begin declare begin wwv_flow_plugin.g_page_item_ajax_result := plugin_jquery_file_upload.plugin_ajax_handler (p_item => wwv_flow_plugin.g_page_item,p_plugin => wwv_flow_plugin.g_plugin );end; end; 4
    33
    0.06214 0.00082 P1_ATTACH_FILES 4
    1
    0.06291 0.00062 … AJAX Upload Operation 4
    1
    0.06352 0.00060 … AJAX ID: C8861296AD1666D9AB70E37C72A7D1DC5CF37D17F4EC78A372FCC425E8028DED 4
    1
    0.06412 0.00068 … File Name: WorkshopM06.pdf 4
    1
    0.06480 0.00075 … File Size: 403694 4
    1
    0.06555 0.00069 … Mime Type: text/html 4
    1
    0.06624 0.00082 … Foreign Key Value: No Value Set 4
    1
    0.06709 0.10042 … File Chunks: 135 4
    100
    0.16755 0.01778 … Foriegn Key Value Not Set 4
    18
    0.18532 0.00202 … File Successfull Saved. 4
    2
    0.18729 0.00070 Stop APEX Engine detected 4
    1
    0.18797 0.01255 Final commit

    Now, I have this on a Modal page using the jQuery Modal function. Could that be causing this issue somehow?

    Thanks,
    Marc.

  10. Marc says:

    Hi Matt –
    I figured out the issue and it was a little weird. When I inspected the foreign key item using Firebug, it showed the value assigned to the item; however when I did ‘View Page Source’ the field appeared to have no value in it. I therefore used some Ajax code to set it in session state and that then resolved the issue.

    One further question I do have is: is it possible to hide the ‘Uploaded Files’ button and/or the popup window listing the files?

    Thanks.
    Marc.

  11. mlepe says:

    Hi Matt,
    I’ve been trying the plugin, using internet explorer 8 and 9 i’ve detected an issue, when the browse files popup rises it allows me only to choose one file at a time; using Chrome it works fine, it allows me to choose as many files as I want. My question is if this issue is solved or can be solved by buying the license?

    • mnolan says:

      Hi

      IE 9 and 8 do not have HTML 5 file API support, so you can only upload one file at a time. This is a browser restriction. I have added this backwards capability to ensure the plugin works across all browsers.

      I’m not aware of any plugin (e.g. flash) that allows multiple slections of files at one time.

      Kind Regards
      Matt

  12. Tony Miller says:

    Matt,
    I downloaded your trial version of this plugin and followed the directions for installing and creating the package header and body, but am running into an issue..

    I have added the plugin to a page and tried running the page and do NOT see any control displaying on the form.. I am using Firefox 14.x under windows xp….

    I can post a link to page in question if you like…

    Thank you,

    Tony Miller
    Ruckersville, Va
    (Yes out of Texas and away from the FDIC..
    Hoping to see you again at KScope 2013 if my abstract are accepted)

  13. Tony Miller says:

    Matt,
    Thanks for the offer.. However, after I rebooted browser (firefox was patching to version 16…) The control is working fine.. Will be talking with company I work for to purchase a license or 3 to support development work we are doing…

    Will also be adding a copy of it to my library of tools when things mellow out a little (after we settle in from relocation and new job)..

    Thanks!

    Tony Miller
    Ruckersville, VA