PHOTO GALLERY

mogmog

Hello.

I have a question how can i show all uploaded images at the multi upload?

Is it posible to show direktly the images they are complet uploated.

in a spechal div case? like dies:


<div id=\"complete\"><img scr=\"uploadet_image.jpg\"><div>

mogmog

Hey Ihave en ideer,

i yuse JSON for file requests howe is it posible refresh the json when an upload is ready?
there ist the code:


$(document).ready(function() {
	$(\"#fileUpload\").fileUpload({
		'uploader': 'upload/uploader.swf',
		'cancelImg': 'upload/loeschen.png',
		'script': 'upload/upload.php',
		'folder': 'files',
		'fileDesc': 'Image Files',
		'fileExt': '*.jpg;*.jpeg',
		'multi': true,
		'auto': true,
		'displayData': 'speed'
	});

	 $.getJSON(\"upload/upload.php\",
			function(data){
			  $.each(data.items, function(i,item){
				$(\"<img/>\").attr(\"src\", item.media.m).appendTo(\"#images\");

				if ( i == 3 ) return false;
			  });
			});
});

afte the upload ther ride the files in to the Database i neede the database datas

can anybudy help me?

iStan

I have difficulties to understand your English.

So what I understand is, after a file is upload you would like to trigger something so the image appears almost immediately after the upload somewhere on your page.

You can use the events onComplete and onAllComplete, check the manual for more information.
What you could do is with the onComplete event, save the filename to a hiddenfield, and simulate a buttonclick (that button can be made hidden) something like $('hiddenbutton_getImage').click();

So now you need to have to wire up a click event on this hidden button to magically access the database and refreshes that part of your page that will display the hidden image.

If you upload more than 1 file at the time you need to consider another way to store the filename, for example an array. And trigger a javascript ajax request.

I hope my explanation is helpful.

mogmog

Hy,

Sorry my englich is not verry well when write somthing,

what you understand is right.
jes I wont to yous the multi upload how can i trigger a javascript ajax request. I know to create an array on php but not in javascript. :roll:

RonnieSan

First, edit the PHP file so it echoes the URL of the uploaded file on the server.
Next, create the div you want display the thumbnail in.


<div id=\"thumbnails\"></div>

Then, add this to the options of your uploadify script:


onComplete : function(event,queueID,fileObj,response,data) {
  $('#thumbnails).append('<img src=\"' + response + '\" />');
}

You can of course edit to fit your needs. I haven't tested this but it should work.

cthamer

Ronnie,

Your code worked perfectly. I should point out to others to remember to modify uploadify.php as mentioned in the post. I missed that my first time around.

This is the code you need to echo in uploadify.php

echo $_REQUEST['folder'] . '/' . $_FILES['Filedata']['name'];

wenlean

cthamer/ronnie,

i followed the steps above but still it doesn't work for me. could you please paste the complete code or if you know a tutorial for this please share it with us.

thank you for your responses to this wonderful topic, hope to learn more from you guys.

thanks.

wenlean

mcgrailm

this is great does the job but how can we show the image before the user chooses to upload ? My thought would be to create a temporary directory and upload it there by default so that the user can see the files in which they uploaded then if they have not removed that file before they hit the upload button it goes to the final uploads folder. However, I'm not sure exactly how to implement that
thanks
mcgrailm

noum77

Hi, I'm new on this highly interresting forum and I WANT some help.
I use a WYSIWYG (what you see is what you get) editor like TinyEditor and a would like to use Uplodify to add image upload function to it so when an image was uploaded, the image is added to the editor "after the pointer".

If it's possible, let me now. GREAT THANKS

PS:TinyEditor replace a textarea, with an unique ID, to a wysiwyg editor.(Sorry for my home made english)

dimitrivisser

Is there someone who can explain how to show the uploaded image after the upload is finished > I tried to follow the advice given above withhout success...

kind regards,
Dimitri Visser
www.weddingpages.nl

KenPrice

Hello,

this thread is a great help. I am having a little trouble with it. I also would like to show the pictures as they are uploaded on the same page and I thought I had everything in there right but I get a HTTP 500 error when I try to upload. Can anyone help? I have the index.php saved as gallery.php, and here is what I have for it, thank you!:

<!DOCTYPE HTML>

Gallery

body {
font: 13px Arial, Helvetica, Sans-serif;
}

PHOTO GALLERY

<?php $timestamp = time();?>
$(function() {
$('#file_upload').uploadify({
'formData' : {
'timestamp' : '<?php echo $timestamp;?>',
'token' : '<?php echo md5('unique_salt' . $timestamp);?>'
},
'swf' : 'uploadify.swf',
'uploader' : 'uploadify.php'
});
});

and the uploadify.php:

<?php<br />/*
Uploadify
Copyright (c) 2012 Reactive Apps, Ronnie Garcia
Released under the MIT License
*/

// Define a destination
$targetFolder = '/uploads'; // Relative to the root

$verifyToken = md5('unique_salt' . $_POST['timestamp']);

if (!empty($_FILES) && $_POST['token'] == $verifyToken) {
$tempFile = $_FILES['Filedata']['tmp_name'];
$targetPath = $_SERVER['DOCUMENT_ROOT'] . $targetFolder;
$targetFile = rtrim($targetPath,'/') . '/' . $_FILES['Filedata']['name'];

// Validate the file type
$fileTypes = array('jpg','jpeg','gif','png'); // File extensions
$fileParts = pathinfo($_FILES['Filedata']['name']);

if (in_array($fileParts['extension'],$fileTypes)) {
move_uploaded_file($tempFile,$targetFile);
echo '1';
} else {
echo 'Invalid file type.';
}
}
onComplete : function(event,queueID,fileObj,response,data) {
$('#thumbnails).append('

');
}

echo $_REQUEST['folder'] . '/' . $_FILES['Filedata']['name'];
?>

Howdy, Stranger!

Categories

PHOTO GALLERY