Tapestry Ajax Upload Fixin

Do you have problems with file uploading when using it with ajax requests?
The issue is that ajax file uploading isn't transparently supported. There are some approaches to solve this issue. I will use jQuery as client side framework and Tapestry5 as server side for all examples.

1. Using advantages of html5 http://www.w3.org/TR/XMLHttpRequest2/#interface-formdata

The main idea is to use special JS interface called FormData. We can create it from existing form element and it will copy all data from it or we can create empty FormData and fill it from scratch. Then we can use it in ajax request and it will work.

... in almost all modern browsers: Chrome 7+, FF 4.0, IE 10+(really?), Opera 12+, Safari 5+. But what about old browsers?

2. Using usual form submission in iframe.
The idea is to emulate asynchronous request via form submission in separate iframe. We just need to create iframe and form targeted to this iframe, attach file inputs to newly created form, copy input values from original form to new as hidden fields, and submit this form as usual. Response from server will be automatically loaded in iframe body.


In this case we should also improve server logic to think about such request as ajax request. And don't forget about escaping.

Thinking about jQuery-UI. Rendering buttons as is with Tapestry5.

Have you ever use a nice js library called jQuery-UI on your applications? Yes, it is realy easy to make some draft markup and then create all needed widgets using this library. For example:


This example will render button, submit and link and then will create ui-button widgets from it using js. As result we will see three pretty-styled buttons. But is everything clear in this example? Let's make some changes that will emulate slow page rendering.


As result we have three unstyled buttons that then flashes to jquery-ui styles(look). Is it so pretty now? And do you think such behavior is correct or you agree with opinion that all page elements should be rendered as is from the beginning? And if you have chosen the second variant let's continue.