2

Basically the below is what i want to do in asp.net c#.

Steps

1.Upload the file in parent window.

2.Click "upload" button.

3.The child window pop up.

4.Upload progress running in child window.

5.File upload progress bar is shown in child window

The purpose of doing that is prevent the parent window from being frozen when uploading the file.

My question is, how can i pass the file from parent to child window in order to process it in child window? This is similar to the video upload in facebook. Looking forward for your answer!! thanks!!

DEN
  • 1,893
  • 7
  • 27
  • 51

1 Answers1

1

You do not have to pass the file from the parent to the child window. You just need a modal (client-side) dialog to display such that the user cannot modify the parent window while upload is in progress.

For starters, you can create a div or a similar section in your HTML that handles the "progress" of the upload. It could be just a spinning wheel animation or a fully functional progress bar. Then, you can look at client-side scripting to display that progress. I would recommend using jQuery UI for this, the jQuery dialog in particular (look under "modal").

Alex R.
  • 4,664
  • 4
  • 30
  • 40
  • hi alex, if doing so, the user have to wait for the file upload and cannot navigate to other pages while the file is being uploaded. I think this is not efficient since the user have to waste time to wait for the file to finish be uploaded first. – DEN Jul 26 '11 at 05:16
  • @DEN, Well, it depends on your objective. In your original scenario, if you navigate away from the upload page, then the upload will be cancelled. How big are the files anyway? – Alex R. Jul 26 '11 at 05:27
  • the file is not big, but there will be some data filtering on the file and downloading progress when the file is being uploaded. In order the user can still use the parent window freely, i'm thinking of using child window to run the progress once it detect the file is being uploaded in parent children. It is just like video uploading in facebook. but i have no idea on how to do it. – DEN Jul 26 '11 at 05:37
  • I see what you're trying to do. It's not as simple as copying a value from one `input[type=file]` to another due to certain security reasons. You might need a third party app for that. What I would suggest though for now, is that you create that child window with the actual file upload form. In this way, the parent window remains intact, and you don't have to pass data between windows. – Alex R. Jul 26 '11 at 05:53
  • 1
    thanks. Perhaps i should use the easy way instead of finding the solution around. But after the file is successful uploaded, i have to display the result in parent windows. arghhhh... any idea..? – DEN Jul 26 '11 at 06:00
  • @DEN, What I would do in that scenario is to do ajax-polling in the server to determine whether the file upload is completed. So, basically you start the upload process in the child window, generate a ticket (guid) for that and send that ticket to the parent window. (Alternatively, the parent can generate the window at the beginning.) The parent then periodically checks if the file upload is completed via that ticket. When done, it does the appropriate action. – Alex R. Jul 26 '11 at 06:14
  • do u have any reference or tutorial for me to study about this? i have no idea about it at all – DEN Jul 26 '11 at 06:37
  • @DEN, I have asked and implemented [something similar](http://stackoverflow.com/questions/6184752/set-timeout-for-controller-action), but on ASP.NET MVC. Take a look and perhaps you can get the idea from it. – Alex R. Jul 26 '11 at 06:48