suppose your client tell you to create a form where he needs file/photo uploader that will work instantly when you will select file/photo.
recently i’ve faced same type of situation for one of facebook app and here is the solution i developed for my purpose.
<form name="fuser" action="http://temp.com/fsubmit.php" method="POST"> <iframe src="photo.php" style="margin-left:-10px;" frameborder="0" scrolling="no" width="465" height="70"></iframe> </form>
in facebook app, i’ve to use
<fb:iframe></fb:iframe>
not
<iframe></iframe>
in iframe src=”" i’ve specified photo.php and below is the code for photo.php
<?php
if ($_FILES['photo']['error'] == UPLOAD_ERR_OK && !empty($_FILES['photo']['tmp_name'])) {
//here i've to upload file into amazon s3 and i set $fileUrl = true;
//you can upload file in local filesystem that code you have to write in this place
$fileUrl = true;
}
?>
<script type="text/javascript">
function photoUpload(){
var obj = document.getElementById('fphoto');
obj.submit();
}
</script>
<?php if (isset($fileUrl) && !empty($fileUrl)) { ?>
Photo uploaded successfully!
<?php } else { ?>
<form action="photo.php" id="fphoto" method="POST" enctype="multipart/form-data">
<input type="file" name="photo" size="56" onchange="photoUpload();">
</form>
<?php } ?>
now when user will select any file, the from will submit by javascript inside iframe, so the main page will not reload and user will instantly see the success message.
Dear Mahmud,
Your iframe based photo/file uploader is just what i am looking for on Facebook! And i can really use some more help on this.
Would you like to assist me further? And is this uploader still online on Facebook somewhere?
Best regards,
Rogier
you’re welcome and this uploader is still online on facebook.
Hi Mahmud,
Where is the uploader on Facebook for us to take it for a test run.
Best regards,
Rogier
great mahmud!!
I just use this in an admin panel, where multiple image has to upload without page reloading. I searched and found many Ajax, Flash based , but yours one is shortest and easy
@Saif, You’re welcome.
Thanks a lot for your tutorials sir..but i want to know few more things..
1.How can i implement this for my facebook application?
2.How can i use photos.createAlbum, photos.upload, and photos.addTag?
3.How can i upload a video or audio to facebook via my application?
all using php.. i am making an iframe based application..
please help me out…thank you in advance.
One more thing… I tried the exact code u have provided and it prompted me for selecting pictures. after that it showed, pictures uploaded successfully…where they were uploaded?
and how can i modify the address where i want to upload the pictures?..
i am newbie in this..please help.
Did you not read the comments? Photo upload code is not provided here just I provided some comments. Because, php upload code and amazon s3 upload codes are different. So learn it and implement as yourself. PHP file upload code is very easy…
<?php// In PHP versions earlier than 4.1.0, $HTTP_POST_FILES should be used instead // of $_FILES. $uploaddir = '/var/www/uploads/'; $uploadfile = $uploaddir . basename($_FILES['userfile']['name']); echo '<pre>'; if (move_uploaded_file($_FILES['userfile']['tmp_name'], $uploadfile)) { echo "File is valid, and was successfully uploaded.\n"; } else { echo "Possible file upload attack!\n"; } echo 'Here is some more debugging info:'; print_r($_FILES); print "</pre>"; ?>thank you sir for your reply…
i have understood the php uploading system now…
thanks a lot for that…
but how can i use those photos.upload, photos.createAlbum, photos.addTag in this uploader??
like the application “My Top Fans” does in facebook…
they create an album in user’s photo directory and name it…how do they do that??? i am able to do that with the old sdk…but with the new sdk i am unable to implement those…please help…
You can call old legacy api using new php-sdk. http://thinkdiff.net/facebook/php-sdk-graph-api-base-facebook-connect-tutorial/ checkout the tutorial and learn how to call legacy api using new php-sdk.
http://code.google.com/p/facebook-gallery-import/source/browse/trunk/client/facebook_php5_photoslib.php?r=6
http://www.easycodingclub.com/facebook-api-tutorials/facebook-php-api-for-photos-upload
how this codes can be used to use graph api to upload photos or add tags to them… i read your article..understood a bit..but not totally….please post one example on photos.upload or photos.addTag….
Good work. Thanks a lot..
assuming i want to get picture from user am using adobe cs5 dreamwaver
if am using iframe how do i retrieve the pic in my database
hi..mahmud…thx for great tutorial…. how to upload multiple image thx and regard metamorfoself