I am trying to upload file Jquery with ajax using php. If i passing Jquery data i not able to retrieve the file upload data how can i pass jquery file upload data to ajax. Kindly some on help me how can upload file through jquery ajax with php..
You cannot AJAX upload.
It's basically a fake AJAX to make it look like it is AJAX uploading.
In reality what happens is that the upload form is given a target of a nearby iframe. This makes it look like it is AJAX uploading when in reality it isn't.
The iframe is normally given a JS function within size of it that triggers a function in the parent windows which shows some kind of message say "Thank you for your upload".
Of course this is only really basic functionality and you'll need to Google search for more exampls, fortunately there are tonnes out there.
Related
I want to have a page where the user makes a request using a known format through CURLing a URL, and the file they provide is then uploaded to the server.
The URL would be like this:
http://localhost/fileupload.php?FilePath=c:\testfile.txt
However, all the guides online work off of form submission or JQuery AJAX requests - can this be achieved with pure PHP?
I have a successfully working interface that I programmed using PHP GD Library where a user can enter multiple lines of text and when the user clicks "submit" it overlays the text they typed onto a png background.
Is it possible to do the same thing but use AJAX in the process? I'd like to somehow let each input field filled out automatically do an onblur, and trigger an AJAX script. That way they see the data entered into the fields change the image on the fly.
Normally when using AJAX, it sends a success callback to an input field, alert, or sets it into a DIV. Would I place the entire GD Library code into the PHP POST page and process it there, then somehow send the compiled PNG image to the AJAX success callback?
I'm just needing a general idea as to if it's possible, and the basic outline as to how I'd go about solving this. Thank you!
EDIT: Here is the last bit of code used to display the image after the text has been overlayed.
imagepng( $my_img, "./images/$form_token.png");
imagedestroy( $my_img );
Will this code end up on the PHP processing page that AJAX POSTS to? Or do I process the image with the GD Library functions and then somehow pass this image as an img src. Will I save it to my server, then display the img src that was saved as the AJAX success callback? I'm confused because I thought AJAX loaded things instantly without refreshing the page but will that still happen if saving the file to the server, then showing it in an image placeholder?
Yes you can.
You may use jQuery AJAX to do this.
Create a php file to respond to the Ajax data from the web page using jQuery, either by POST or GET method.
Make the php file return a success message on successful processing on data, and you may program something in your JavaScript to display success message.
You can read a tutorial here www.w3schools.com/jquery/jquery_ref_ajax.asp
Hope this helps..
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.
Started with ajax last week. How would I upload an image using it. What I want to do is upload an image. I would imagine using input type="file" then the PHP file needs to collect the URL of the newly uploaded image. And return it to the ajax function to put the URL inside an <img src"" >
How would one do that.
Any ideas?
Marvellous
I would recommend Valums ajax upload script. If it comes across a browser that does not support upload via ajax it will gracefully handle them via hidden iframe uploads
Note: IE (all flavors) does not support file uploads via ajax and will therefore default back to iframe upload.
You can't send files through AJAX consistently. You will need to submit your form into a hidden iframe to simulate an AJAX transaction. Using an iframe ensures that your application will be compatible with all browsers - particularly the IEs.
After digging through my bookmarks a simple script to facilitate this might be found with http://valums.com/ajax-upload/ but I have not used it.
I need to post a form which includes personal details and I need to upload an attachment file also I need to achieve this using AJAX.
How can I upload a file using AJAX , I need to post the personal detail as well as upload a file at the same time using AJAX , how can I do this?
You can't upload files with AJAX because you can't do multi-part encoded requests - that's a limitation of the XMLHttpRequest API.
Workarounds for this typically involve using an IFRAME that is the target of a form that handles the actual file upload as a separate sub-process to the overall form. The response loaded in the IFRAME then communicates back to the DOM in the parent/calling page with information about the uploaded file.
If you add a hidden iframe on the page
<iframe name="iframe1" ... />
And the change the target on your form to post to the iframe
<Form traget="iframe1" ...>...</form>
You can upload and post the data to the page. You can also use javascript (JQuery) to get hook into the events of the iframe.
To get a upload progress meter, use the php uploadprogress module. It works great!
http://pecl.php.net/package/uploadprogress
and
http://bluga.net/projects/uploadProgressMeter/
Here is a link i found that may help:
http://www.finalwebsites.com/forums/topic/php-ajax-upload-example