I need to upload an external image when a user pastes the url into an input bar. I am using dropzone, jquery, and backbone. So I'm thinking dropzone to upload the image, but I don't exactly know how it would work without the user literally dropping the image onto the page from the page they get it from. Any thoughts?
Related
I have an HTML form with input tags and file tags. The user can upload an image and a data URL for that image will be generated using Javascript's file reader. A small preview of the uploaded image will then show up on the screen with its data URL passed in as the image source.
The data URL will also be passed in as a value for an input tag in the form.
Upon form submission, the data URL will be stored in a database. The user can then view an image gallery with all of the uploaded images (which will be accessed through the stored data URLs).
Everything works fine when uploading images from my laptop. However, the problem occurs when I upload large images from my iPhone and iPad. When uploading large images from my iPhone and iPad, only a small part of the data URL gets inserted as the input tag's value, and as a result, only a small part of the image gets rendered when viewing it in the image gallery. The image preview that shows up on the form page is fine on iOS - I can view the entire image there. I am just not able to submit the data URL, a long string of text (sometimes nearing a million characters) in its entirety. I have not set a maxlength value in my input tag, so I can't help but feel like there is some predefined maxlength value for html input tags on iOS.
Again, I have no problems uploading large images from my laptop - the entire data URL gets passed through and stored in the database. I am able to view all images uploaded from my laptop clearly and fully in the image gallery on all devices. I am just not able to upload large images in their entirety from iOS (iPhone/iPad).
Why could this be happening? And how can I ensure that the entire data URL gets passed in as the input tag's value on iOS?
I have a set of web pages and i want to set them with a background image but it must be something the client chooses through an
so all the pages have the background image the user chooses
also i'm loading the page using a node.js and express backend.
I already tried uploading images but it doesn't persist it must stay that way even after they close the application
I expect that when you open the web page you see the background you choosed
EDIT: ok so i'm thinking about loading it from a image folder and then storing the name of the image in the database?
any ideas or suggestions?
You can use multer to upload the images to your server and then save the images with reference to the user [user id] that uploaded the image. So next time when that particular user opens the web page, you will have a reference to their saved images. I hope this helps.
I have a image upload page. When user upload an image they can preview it and add text into it before it save into database.
my question is
how can i preview the image in 2nd (preview page)
1.I have try file reader, but its not work for most of old browser. so im seeking another way
2.do i need to create another folder and save temp image into it?
(than save it into image folder after user have finished the editing)
something like google+ or facebook, how did they achieve this?
You could just receive the uploaded file, save it into some temporary folder and then show back to client. If they save form then move into the final folder. Otherwise every 24 hrs (or whatever you feel is necessary) delete the image or maybe if you can track pages then delete old images when they change pages
I am developing a mobile application that has this scenario: A user goes to one screen where they supply indexing meta data for an image. From this first screen they can go to a second screen where they select and upload the actual image to go with the meta data. Once selected, they go back to the first screen where they can then upload both the image and the meta data to a separate web service. Now, once the image has been selected and the user is back on the first screen, they may want to look at or change the image (that they previously selected) before actually submitting it to the web service. So I need to provide a way for the user to go back to the second screen and see the image they previously uploaded (without having to select it again). Clear so far?
In my ASP.Net MVC mobile application code I am caching the uploaded image to the server in a temporary file path on the server. Now I want to take that saved file and load it into a javascript image object so it can be displayed to the user when they go back to the second screen. How can this be done?
When you upload it to the server, the server can respond with a URL that can be used to retrieve the uploaded image. Capture that response and use it to set the src attribute of a new client-side Image object.
I'm developing a custom module for Drupal dealing with Document Management. At this point, the module loads, you can upload files (via a hidden iframe and some ajax requests), browse directories and set various levels of permissions. And everything works perfectly in Firefox.
Issue:
In IE however, I run into an issue. For some reason when I upload a file the save file dialogue pops up and asks me to download the file I just uploaded. It looks like it's asking me to download it from the web-servers tmp location however, as that seems to be the file-name and such. However, if I hit cancel and refresh the page I can see that the file I uploaded did actually get uploaded to the server.
Here is how the upload process works. Click the upload button. The upload button is the standard file input form element hidden and placed over a styled version of the button. Clicking on this causes the "Choose a file" dialogue to open.
Select a file and click "Open". A modal dialogue pops up asking you for some further information about the file. The modal is part of the same form element but remains invisible until you click Upload button
Clicking save in the modal causes the file to be uploaded. The "action" attribute on the form is pointed to a page and the target is the iframe.
The iFrame is polled a few times every second to see if it's contents have changed. When the file is uploaded a "success" message appears in the iframe. Since it belongs to the same domain, I scrape the content within the iframe.
Once the iFrame says that the file has been uploaded, I use some JS to update the application with the name of the file
Since I can't use Firebug in IE, I have to stick to utilizing Microsofts Web Developer Toolbar, which makes it very hard to figure out if the bolded step is actually occuring. It seems like it should, since the file IS being uploaded. It is just getting interrupted by that file download dialogue.
Since no one seems to have an answer, I'll post the fix I found. I doubt it's perfect, but it's the best solution I could come up with.
It turned out to be an issue with the polling as suspected. The fix ended up being instead of outputting json to the iFrame, just output some JavaScript that calls a function that updates the main window. That simple.