file upload in form field for mobile web app

Question

i am developing mobile web app using spring(spring mvc). I need to devlope a form which enables the user to upload file(resume) and on submit it will be stored in database. I am not getting the idea how to finish that! In the form when i use input type as file, it's working in diffrent manner on diffrent browser. If any one have did it ,please tell me the steps or some working demo at any site. yes i don't want to use some third party tool. thanx.

Answer 1

Sorry dude, your kinda SOL on this one. The file input type is a different beast than most. Each browser implements it in their own way, so it will never look the same on multiple browsers. Also, for security reasons, you can't trigger the file inputs with JavaScript, so you can't make an invisible file input that you would interact with through other standard inputs. Many before you have tried, all have failed. I spent days researching possible alternatives when I had nothing better to do, and they all came up against the security issue. Jquery provides the closest thing but still required a browser switch for one of the major browsers (can't remember which one off the top of my head).

So now that the bad news is out of the way, here's what you can do. Put a button on the screen and style it how you like. Put a file input on the screen and using absolute positioning and a higher z-index put it right over the top of your button. Now make it transparent (not display none, but using opacity and filter:alpha styles), now the user thinks they are interacting with your standard button, but the invisible file input above it intercepts the click. Will be the closes you can get to a file input that behaves and looks the same in all browsers.