Adding an image to a responsive website that sends it to an SQL database

Question

I'm stuck with something. We have made a project in school but we aren't passed so now we have to improve it. The project consists of controlling situations and events of a city. It is meant for smartphones but we don't know any mobile programming language yet so we can write it in html and javascript. We also can use JSON and AJAX to "talk" with our back-end. Example : there is a hole in the road, so i want to add this situation and i'm able to give details, it automatically gets the location by google maps.

So now to the point, there is a page called add.html, on this page i can add events or situations with all the details. We have everything but we are stuck with the image part. We need to be able to add an image to our database. Our website is responsive, i want to have an icon of a camera (so you can take a picture with your smartphone and add it, or you can choose from the pictures on your smartphone) that is a hyperlink to adding an image. So if you are on a pc or laptop it should open your browser where you can choose a picture from your hard drive, and elsewise like i said above. Does anyone has an idea how we need to approach this problem? Thanks a lot in advance!

We could all just offload our work somewhere couldn't we? No point in having a Q&A site then @MohammadAreebSiddiqui. To the OP, search for 'php upload' or 'ajax file upload' and you'll find what you need — rath, Jul 23 '13 at 12:17
@rath I think here we are to help in programming not for creating what they want. — Mohammad Areeb Siddiqui, Jul 23 '13 at 12:18
have you actually tried to implement this? if so post the code — Mangiucugna, Jul 23 '13 at 12:33

score 1 · Answer 1 · edited May 23 '17 at 10:25

1

Make your camera icon an input that looks like this:

<input type="file" accept="image/*" capture="camera">

This will launch the camera app in iphone iOS 6+ and android 3.0+.

There is a javascript API for navigator.getUserMedia(). This works in Chrome, Firefox and will work in IE 11. See HTML5 Rocks: Tutorials: Capturing Audio & Video in HTML5 for details.

edited May 23 '17 at 10:25

Community

1
1

answered Jul 23 '13 at 12:17

Colin Pickard

45,724
13
98
148

Thanks @Roman I didn't realize support was so limited still. I've done some research and updated the answer. – Colin Pickard Jul 23 '13 at 12:32

Adding an image to a responsive website that sends it to an SQL database

1 Answers1