I wud like to use file upload(ajax/javascript with php) in my form that has other controls also.
when i uploaded an img it displays on the same form with delete option.
if i click on submit it goes into folder as well as database &
if i click on delete it deletes an img....
anybody can help me?pls
u knw gmail file upload exact like that
It boils down to "Don't use XHR. Do use Flash or iframes". There are libraries that will do the heavy lifting for you.
Just use jQuery ajax upload plugin http://valums.com/ajax-upload/. It is actually not ajax, it's invisible iframe, but result is almost same.
For server-side you can use php with gd-library and some simple MySQL queries.
Related
I want to have a single button that when clicked opens a file dialogue, and then after the user selects the photo they want to upload and the dialogue closes. I want the photo to upload. I cant think of a way of doing this because in the form you cant use both the type = file and type = submit together. Would I need to use jquery to achieve this? Thanks.
Yes, the idea is to use jQuery for the inital part of having a user pick a file to upload... and then some sort of other, server-side language (like PHP,) will actually do the heavy lifting (by actually uploading the file.)
Here's a jQuery plugin that helps you do this:
http://blueimp.github.com/jQuery-File-Upload/
EDIT:
Yes, I believe with jQuery (or some other library... or plugin,) it would be possible to have an event listener (or something,) pick up when a user browses for a file to upload... and automatically starts to upload it once the file has been chosen. But, again, as was said earlier, it's probably safer to take a two-step approach to file uploads for now.
try this
One-Click Upload is a jQuery plugin that replaces the standard file
input element, allowing you to use any link, image or element to be
used for the purpose of bringing up the "file browse" dialogue. It
completes the upload behind the scenes without refreshing the page,
making it less obtrusive and easier to style than a standard upload
form.
To get the upload started the way you describe you will need to use JavaScript. jQuery is a very good library to use to make that process easier, but it is not required.
i have a doubt with the upload system in PHP.
What is the difference between Normal Upload [ without ajax ] and Ajax Upload ?
By using Javascript i can send values to the server ,is it possible in the case of Files ?
Is there any limitation for this ? and i found that so many uploaders are using FLASH for to upload FILES,
ex:Gmail,uploadify.....
How can i build a basic uploader with JQUERY/javascript ? also i heard that i cant send FILE by a XHR request.
i am using Codeigniter Framework.
Expecting Possible duplicate or other refference
Main Goal Of this Question is to build my own uploader for my current project[neat and clean]
Okay, AJAX upload is basically just that, it's going through Javascript. The difference is that the page does not upload, and you can carry on with other things as it works. It generally makes for a better user experience in my opinion, it feels more seamless
On the other hand, it only works for newer browsers. Firefox, Chrome, Opera have it, but not IE (maybe Safari?). It also works well with drag and drop. I once made an image uploader inside a text editor, where it popped up a table with your currently uploaded images, you clicked one and it added it to the textbox or you dragged a new image into a box and it uploaded and displayed it straight away. It was beautiful.
Here's the plugin I used to help me
http://dropup.net/
Edit: No limitations either, you can even send plain binary data in
well as if you want to upload the file with jquery ajax request then use ajax form plugin as well,
this link Ajax From will help you to understand and implement on your page,
but i don't know about codignighter frame work cause i don't have experience of that. And ajax is the best way to distribute the process into different parts with any extra load on the page i mean ajax request will work on the back end..
I have the following scenario:
user selects an image to upload (simple form with input field where type="file")
File is upload to server (also Db is updated)
all this i already have..
I need to display the uploaded image on the page, upon success , without refresh.
Can this be done without iframes?
I have already done some ajax coding where input is saved to db or is used to return content from db.
The thing here is sending the actual file data from the field. Can I do this using jquery's $.get?
I was thinking that after copying the file and storing relevant data in the db i could return the new location (the path in the server where the file was copied). The jquery code catching this return could use it to set the src atribute of an img tag to the new file' thus displaying it.
Can you please recommend relevant tutorials or demos?
also, any tips would be very appreciated
u need javascript for that. Provide an onClick function with ur input type file element and in that function using javascripts createElement(), setAttribute(), appendChild etc functions to append the new image to the document object.
hope it helps
The best way to do this is to use a javascript-based AJAX upload function, and there are several javascript/jQuery plugins that do this. Check out this tutorial which explains one way of doing this using the ajaxupload.js plugin, for which you can find more documentation here.
I also wrote my own tutorial on this topic, including some PHP code that you need to save the image and other changes that I think are useful for beginners. You can find that here.
You can achieve this using AJAX with PHP and MYSQL. You can upload the image with AJAX and FormData, then validate and save the image in the server and send the URL of the image in a JSON response.
Note that the most important part of this is the validation.
See this beginner's guide to learn more.
Upload file without form
Yes i used the search button but i just couldn't find the solution i need.
Is there any way to upload a file so that user wouldn't need to press any form buttons?
My first idea was to use CURL but then i remembered that CURL is server sided.
I know it's possible thru Java and/or Flash but is there any way to do that using PHP & OR Javascript?
Edit:
Thanks for clearing this for me but...
But what about PHP based FTP upload?*
No, it isn't. That would have been a huge security hole. Your best bet is really an officially signed(!) Java applet. An unsigned or a manually signed one would still emit scary warnings to the enduser before proceeding.
I have found a solution. Copy does not take local files and the example of submiting the file does not work if it is local. What you have to do is:
file_get_contents("file:///C:\img.jpg")
then write to a text file the contents in the server (for example /uploads/img.txt) and rename to the same extension of the file to see the image.
It really works with any kind of file.
what do you mean without pressing any form buttons ?
well you could do a javascript document.getElementById('FORM_NAME').submit(); if you want some function in javascript to do the upload , where FORM_NAME is the id or your current html form .
but you CAN NOT make your webpage select the file to upload , you have to let the user select the file in an <input type="file"> element .
otherwise use a java applet
I have form that uploads file's perfectly, with a post-page-refresh-form.
However I have ajaxiefied the form with jquery's $.post
All of the data except for the file upload is saving nicely.
Is there somthing special I need to do to the form or in jquery to get the upload to work?
Thanks!
You cannot upload with javascript (it would mean granting js file access on your computer, a no go from security standpoint). Uploadify has a nice solution.
First off, I agree with Wrikken about Uloadify being a great solution.
But, yes, Javascript does not have access to upload files. There is a way around this by using Flash, but I would not go through all the trouble to build it yourself when there are other plugins out there that will take care of it all for you.
You can make it "lookalike" AJAX.
Use a hidden iframe and send your form into this iframe, you will be able to observe the onload of the iframe and get a response.
This way gives you also the option for an easy fallback if JS is disabled.