send variables

searls03 · June 1, 2011

sorry there is so much code, but how can I make it so that the flash upload piece of this will be able to send variables, such as file name, to upload-file.php.....so that things can go into my database. does this make sense? if you need a working example, tell me and I will send you a PM with the address (don't want too many people knowing where this happens at......

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Multiple File Upload With Progress Bar - Web Developer Plus Demos</title>
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript" src="js/swfupload/swfupload.js"></script>
<script type="text/javascript" src="js/jquery.swfupload.js"></script>
<script type="text/javascript">

$(function(){
$('#swfupload-control').swfupload({
	upload_url: "upload-file.php",
	file_post_name: 'uploadfile',
	file_size_limit : "9000000000000000000000000000",
	file_types : "*",
	file_types_description : "Image files",
	file_upload_limit : 1000,
	flash_url : "js/swfupload/swfupload.swf",
	button_image_url : 'js/swfupload/wdp_buttons_upload_114x29.png',
	button_width : 114,
	button_height : 29,
	button_placeholder : $('#button')[0],
	debug: false
})
	.bind('fileQueued', function(event, file){
		var listitem='<li id="'+file.id+'" >'+
			'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+
			'<div class="progressbar" ><div class="progress" ></div></div>'+
			'<p class="status" >Pending</p>'+
			'<span class="cancel" > </span>'+
			'</li>';
		$('#log').append(listitem);
		$('li#'+file.id+' .cancel').bind('click', function(){
			var swfu = $.swfupload.getInstance('#swfupload-control');
			swfu.cancelUpload(file.id);
			$('li#'+file.id).slideUp('fast');
		});
		// start the upload since it's queued
		$(this).swfupload('startUpload');
	})
	.bind('fileQueueError', function(event, file, errorCode, message){
		alert('Size of the file '+file.name+' is greater than limit');
	})
	.bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){
		$('#queuestatus').text('Files Selected: '+numFilesSelected+' / Queued Files: '+numFilesQueued);
	})
	.bind('uploadStart', function(event, file){
		$('#log li#'+file.id).find('p.status').text('Uploading...');
		$('#log li#'+file.id).find('span.progressvalue').text('0%');
		$('#log li#'+file.id).find('span.cancel').hide();
	})
	.bind('uploadProgress', function(event, file, bytesLoaded){
		//Show Progress
		var percentage=Math.round((bytesLoaded/file.size)*100);
		$('#log li#'+file.id).find('div.progress').css('width', percentage+'%');
		$('#log li#'+file.id).find('span.progressvalue').text(percentage+'%');
	})
	.bind('uploadSuccess', function(event, file, serverData){
		var item=$('#log li#'+file.id);
		item.find('div.progress').css('width', '100%');
		item.find('span.progressvalue').text('100%');
		var pathtofile='<a href="uploads/'+file.name+'" target="_blank" >view »</a>';
		item.addClass('success').find('p.status').html('Done!!! | '+pathtofile);
	})
	.bind('uploadComplete', function(event, file){
		// upload has completed, try the next one in the queue
		$(this).swfupload('startUpload');
	})

});	

</script>
<style type="text/css" >
#swfupload-control p{ margin:10px 5px; font-size:0.9em; }
#log{ margin:0; padding:0; width:500px;}
#log li{ list-style-position:inside; margin:2px; border:1px solid #ccc; padding:10px; font-size:12px; 
font-family:Arial, Helvetica, sans-serif; color:#333; background:#fff; position:relative;}
#log li .progressbar{ border:1px solid #333; height:5px; background:#fff; }
#log li .progress{ background:#999; width:0%; height:5px; }
#log li p{ margin:0; line-height:18px; }
#log li.success{ border:1px solid #339933; background:#ccf9b9; }
#log li span.cancel{ position:absolute; top:5px; right:5px; width:20px; height:20px; 
background:url('js/swfupload/cancel.png') no-repeat; cursor:pointer; }
</style>
</head>
<body>

<h3>» Multiple File Upload With Progress Bar</h3>

<div id="swfupload-control">
<p> </p>
<input type="button" id="button" />
<p id="queuestatus" ></p>
<ol id="log"></ol>
</div>

</body>
</html>

searls03 · June 1, 2011

and here is upload-file.php

<?php
include_once "secure/connect_to_mysql.php";

$uploaddir = 'images/'; 
$file = $uploaddir . basename($_FILES['uploadfile']['name']); 
$size=$_FILES['uploadfile']['size'];
if($size>1048576)
{
echo "error file size > 1 MB";
unlink($_FILES['uploadfile']['tmp_name']);
exit;
}
if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file)) { 
  echo "success"; 
} else {
echo "error ".$_FILES['uploadfile']['error']." --- ".$_FILES['uploadfile']['tmp_name']." %%% ".$file."($size)";
}
?>

searls03 · June 1, 2011

this right here is what I want to change to a string to submit.....how can I do this?

var pathtofile='<a href="images/'+file.name+'" target="_blank" >view »</a>';

searls03 · June 1, 2011

does this make any sense at all???????? :confused: :confused:

fugix · June 1, 2011

please stop bumping your thread(s)..and no your question doesnt make sense to me

searls03 · June 1, 2011

sorry, so i need to change

var pathtofile='<a href="images/'+file.name+'" target="_blank" >view »</a>';

into a php variable that can be submitted......all though this will need to be an array. or maybe a better way is to say that I want to take each file name and submit it to the database, only thing is that the files upload directly to the server after the upload is complete. I am going to take the file path and put it in a slideshow, but I need to make it so that the file path, the code I posted above, will be in the database. does this make more sense?????

Drummin · June 1, 2011

Try changing your link to

var pathtofile='<a href="upload-file.php?file='+file.name+'">view »</a>';

Then on your upload-file page you'll need to "pickup" the GET value.

$uploaddir = $_GET['file'];

Anyway, something like that.

searls03 · June 1, 2011

one more thing(I think)....how can I add a field called eventname so that for each file that is submitted to the database with the code drummin gave me, so that each picture uploaded in the page load will all have the same event name.........does this make sense. so basically I want the eventname to post at the same time the file piece posted........the problem I am running into is not using a submit button.....

Drummin · June 1, 2011

Just add the event name to the link and "pickup" the GET on your upload-file page.

var pathtofile='<a href="upload-file.php?file='+file.name+'&eventname=AddNameHere">view »</a>';

searls03 · June 1, 2011

but I want to be able to type the name in..........and then it submits with no submit button.......is this the same way I would do it........

Drummin · June 1, 2011

Well I think you'll need to use a stand form/submit if you're planning on using text input.

searls03 · June 1, 2011

do you know of anyway that I could type in the name and then have it submit with each file?

Drummin · June 1, 2011

Why not surround your image table with a form. Add a checkbox by each image and a text input field to enter the event name. Post info to your upload-file page a process all info posted.

searls03 · June 1, 2011

can you tell me where this is defined?

+file.name+

searls03 · June 1, 2011

or is that like a server side thing?

Drummin · June 1, 2011

I may be wrong but it looks like it's here

var item=$('#log li#'+file.id);

searls03 · June 1, 2011

is there a way to make $id the same for all entries based from this code?

<?php
include_once "secure/connect_to_mysql.php";
function genRandomString($length = 20) {
     $characters = '0123456789';
     $string ='';    


    for ($p = 0; $p < $length; $p++) {
         $string .= $characters[mt_rand(0, strlen($characters))];
     }

    return $string;

}
$uploaddir = 'images/';
$id= genRandomString();
$file = $uploaddir . basename($_FILES['uploadfile']['name']); 
$size=$_FILES['uploadfile']['size'];
if($size>999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999999)
{
echo "error file size > 1 MB";
unlink($_FILES['uploadfile']['tmp_name']);
exit;
}
if (move_uploaded_file($_FILES['uploadfile']['tmp_name'], $file)) { 
  echo "success"; 
} else {
echo "error ".$_FILES['uploadfile']['error']." --- ".$_FILES['uploadfile']['tmp_name']." %%% ".$file."($size)";
}
$sql = "INSERT INTO pictures(image, id) 
	VALUES('$file', '$id')";
$rs = mysql_query($sql) or die ("Problem with the query: $sql<br>" . mysql_error());
	echo mysql_error();


?>

searls03 · June 1, 2011

how can I make a hidden form field inside this code with a value of genRandomString()?

.bind('fileQueued', function(event, file){
		var listitem='<li id="'+file.id+'" >'+
			'File: <em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) <span class="progressvalue" ></span>'+
			'<div class="progressbar" ><div class="progress" ></div></div>'+
			'<p class="status" >Pending</p>'+
			'<span class="cancel" > </span>'+
			'</li>';

Sign In

send variables

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Join the conversation

Important Information