FileUpload: choosen file isn't shown in preview

[Stefan Mondelaers]

I am using the FileUpload in advanced mode. I used it before on another page in the same application where it works.
But now I am trying to use it again on another page and I can't get it working.
The 3 buttons (choose, upload and cancel) appear. When I choose a file the buttons "upload" and "cancel" are enabled but the choosen file isn't shown under the buttons.

When pressing the upload button, I get the following message (and my handler is never called):

Uncaught TypeError: Cannot read property 'submit' of undefined

Source: fileupload.js.xhtml?ln=primefaces&v=5.2:1
I have been looking with the debugger in the javascript. The error occurs in the following block of code:

Code: Select all

    upload: function() {
        for (var a = 0; a < this.files.length; a++) {
            this.files[a].row.data("filedata").submit()
        }
    },

I think this error is caused because after choosing a file, it is added to the array named files but data("filedata") should also exist and doesn't exist for the file. So the script tries to call the submit method of something undefined. I guess the undefined thing is an input which should be added to the html after choosing a file and which isn't added.

Does any one have an idea what might be causing this problem?
I have no idea whether it's relevant, but the page where the FileUpload works is for uploading images and allowTypes is specified there, while on this page I am uploading text files and the attribute allowTypes isn't specified. So I tried to choose an image file (gif or png) but that isn't shown either and in that case the buttons Upload and Cancel remain disabled.
When specifying allowTypes and selecting a bad file the error message is shown under the buttons, but when a matching file is selected it's still the same. It doesn't work.

[Stefan Mondelaers]

I have got it working now. The FileUpload was embedded in 2 panelGrids. After removing both panelGrids the FileUpload works.
It seems that a panelGrid can mess up the HTML element tree structure in such way that the FileUpload doesn't find it's own files list table any more (It uses JQuery to find it).

So, I can go on with my work.
But I still don't know what exactly happened, and I would like to know.