jQuery post upload file - php

I have a image upload form which adds an image to my server, although I'm wanting to load the information through jQuery ajax so the form doesn't refresh on submit.
At the moment I have
$('.img-form').submit(function(e) {
e.preventDefault();
$.post(document.href, $(".img-form").serialize());
});
Which seems to post the document, although i need to get it to call my ImageUpload() function from the PHP once I've pressed the submit.
My php function is called something like this,
<?php $Users->TutorialImageUpload(); ?>

If I understood correctly, you wish to upload an image without refreshing the page, and call your imageUpload() function.
As mentioned in the comments, you cannot upload in such a manner, however, what you could do
is put your upload form and code in a seperate php file and include it in the page as an iframe. This would upload your files withough refreshing the page.

Related

Create pdf file after PHP form submit

It is possible to create a pdf file after a PHP form has been submited?
I need to print an order details after a php form is submited.
At this time i have a small jquery script that allows to print page that it prints only html content the php variables not.
$(document).ready(function() {
$(".btnPrint").printPage();
});
Any advice much appreciated.

how to upload file php through jquery and smarty

i need to upload a file doc or pdf or rich text through jquery and smarty
i try to pass the file in jquery is given below
window.location.href= sitePath+'download?p='+$('#file').val();
but the p doesn't have value. how to get the file path or name and how can stored in server
in controller i write just pass the query to model is given below
$model=new download();
$id=$model->upload($param);
and i can't develop the model code....
please help me
You can't send files like that.
You should either submit a form with enctype="multipart/form-data" or use some AJAX uploader (which uses form submit to iframe and then stores a file using PHP script).
EDIT: Some references
http://www.w3schools.com/php/php_file_upload.asp - tutorial on how to upload a file using PHP
http://valums.com/ajax-upload/ - example of ajax uploader.
EDIT2: The problem is not with your model code but with the way you try to submit a file.

save a file generated by a php script in to a directory by save dialog form

I have a php script that generate a pdf file.
So I have an html page with jquery javascript that do an ajax call at this php script and retrieve the pdf file content.
I would that this file will be saved in a location choosed by a save file dialog.
How can I do it?
Thank you so much.
You don't need Ajax - just do a
location.href = "fileURL.php";
(or alternatively, have the user click on a link) and if the headers are set correctly, a download dialog will present itself.

How insert PHP output into html div replacing temp graphic

I need to display an html page and within the page is a div into which I want to echo the output of a PHP page.
While the PHP page is being fetched and prepared I want to display a "Loading" msg and a temporary gif.
I have the html code working
and I have the PHP code working/echo'ing.
How do I echo the contents of the PHP page to replace the original contents of the Div.?
(I guess - with an include:file and an innerhtml statement, but how/where?)
A Javascript solution would be fine.
Thanks
Add a div to your page with the image in it, then using jQuery:
$('#myDiv').load('mypage.php');
You're essentially looking to make an asynchoronous call to your php script once the page is loading, so JavaScript is your friend.
When the page loads, include the loading message and the temporary gif, then do an ajax call to your php script and insert the response into the relevant div.
As #Sjoerd points out - jQuery will do this for you nicely.
take a look into ajax:
The Low-down
Using ajax with jQuery

How to upload and read text/csv file without submitting?

I have this form and I would like to read the uploaded file and then fill out the form using this read information without refreshing the page.
For example the first word might be "Bob" and so I would want that to go in my input text "First_name." I've been trying to searching online for a way to do this using JQuery or Ajax but I can't seem to find a solution.
Can this be done using the two methods previously mentioned? If so and if not can someone point me to a link or to where I can learn how to do this? The instances I have found include where one uses JQuery to upload the file and display the size without refresh (which is not exactly what I want).
I have also found how one can use an iFrame but this again is not what I want. I suppose I could always just submit the part of the page containing the textfile related information and show the same form but with the filled out information. But I feel as if this is kind of sloppy and I want to know if there is a better way.
Thanks.
Firefox has a method to do this, the File and FileList API provide a way to get at the files selected by a file input element and have a text retrieval method.
A very basic example:
NB. Not all browsers support this code.
[I think Chrome, Firefox and Opera do at time of writing.]
HTML:
<form>
<input type="file" name="thefile" id="thefile" />
</form>
<div id="text"></div>
JS (using jQuery):
$(document).ready(function() {
$('#thefile').change(function(e) {
if (e.target.files != undefined) {
var reader = new FileReader();
reader.onload = function(e) {
$('#text').text(e.target.result);
};
reader.readAsText(e.target.files.item(0));
}
return false;
});
});
Demo: http://jsfiddle.net/FSc8y/2/
If the selected file was a CSV file, you could then process it directly in javascript.
.split() will be useful in that case to split lines and then fields.
the only way I know would be to submit the form to a hidden iframe. this will upload teh file without refreshing the page. you can then use any returned info using javascript. this is what they use for fake ajax style image uploads that let you preview an image before uploading. the truth is it already has been uploaded via a hidden iframe. unfortunately however iframes are not xhtml 1.0 compliant.
something like this article may help:
http://djpate.com/2009/05/24/form-submit-via-hidden-iframe-aka-fake-ajax/
The question you might ask is :
why should I use this method instead of real ajax ?
Well they’re is numereous answer to that but one good reason it that
is doesnt require any type of ajax libs and you can start using it
even if you never used ajax before.
So here it goes.
<form method=”post” action=”formProcess.php” target=”hiddenIFrame”>
<input type=”text” name=”test” /> </form>
<iframe style=”width:0px;height:0px;border:0px;” name=hiddenIFrame />
This is just a normal form but you’ll notice the target in the form
tag, this tells the form to submit in the iframe instead of the
current page.
It’s works exactly as the target attribut on the A tag.
Also the iframe is hidden from the user using
style=”width:0px;height:0px;border:0px;”
now the file formProcess.php is not different from your normal form
processing file but if you want do something on the main page you have
to use JS like that :
window.parent.whatEverYouWannaDoInParentForm();
You can also upload file with this method !
Please checkout the formphp for full example.
Cheers !
Nb : You will see the status bar acts like the page is reloading but
it’s really not.

Categories