以AJAX格式上传文件和相应的数据

Question

I need to upload a file with a form in a single-page (AJAX) web application, but the file is useless without the rest of the data on the form in that panel. There are only three INPUT s, but one can be a quite lengthy text area. How can I capture this?

If I upload the file using an isolated AJAX file-upload technique (like the Fine Uploader http://fineuploader.com/ widget), then I have to handle two counter-intuitive elements:

• CLIENT: The user transmits the file, the main part of the transaction, before actually approving the transaction. They then wait for this to complete, even if they decline to continue. The UI must disable screen elements to prevent the scenario where a client might submit the associated data before or during the file upload. It's extra effort to send the file at the wrong point in the process.

• SERVER: It requires a ticketed-cache. The back-end must cache the uploaded file and provide a ticket to the client for this file. The client must send this ticket with the upcoming request. Ideally, the cache also should clean up old tickets under various circumstances, such as if the form is cancelled, another file is uploaded, or the user session times out. More extra work (although this ticketed-cache functionality would be nice to have in my server).

Is it a sensible solution to instead place the whole form in an IFRAME ? Will I have problems manipulating that and making it appear to be a well-integrated part of the single-page application? I've always stayed away from them in the past.

My platform is jQuery, ASP.NET MVC, the usual browsers (plus probably mobile).

Answer 1

在我的情况下，只需将表单发布的目标（包括文件和文本输入）设置为不可见的iframe并监视iframe onload事件，就很容易解决了。