View Single Post
Old 03-25-2009, 09:12 PM   PM User | #1
MetZ80
New to the CF scene

 
Join Date: Mar 2009
Posts: 5
Thanks: 0
Thanked 0 Times in 0 Posts
MetZ80 is an unknown quantity at this point
Question Ajax jquery and image upload ;/

Hi..

I have been searching the internet for most of the day, trying to solve my problem.

Code:
page.js
$('#addButton').click(function(){
		$.blockUI({ message:'<img src="images/loading.gif" alt="Loading" />', css:{'color':'#ef6900','border':'1px #626262 solid','padding':'20px','text-align':'center'}});
		$('#content').slideUp(800,function(){
			$.ajax({
				type: "POST",
				url: "page.php",
				data: ".rand=klasdnsaefr",
				success: function(data){
					$('#content').html(data);
					$('#content').slideDown(800,function(){
						$.unblockUI();
					});
				}
			});
		});
		return false;
	});
});
Clicking ADD button "slidedown" this case from page.php
Code:
case 'klasdnsaefr':
?>

	<form action="#" method="post" enctype="multipart/form-data">
	<div id="errorMsg" class="errMsg" style="display:none;margin-bottom:15px;" align="left"></div>
	<FIELDSET class="admin_fieldset">
	<legend>ADD NEW</legend>
	<table width="100%" border="0" cellspacing="1" cellpadding="3">
	<tr>
	 <td width="150px" align="right" valign="middle" class="bg12">TITLE</td>
      <td align="left" valign="middle"><input type="text" class="textarea" id="title" name="title" style="width:250px;" /></td>
	</tr>
	<tr>
	 <td width="150px" align="right" valign="middle" class="bg12">IMAGE</td>
      <td align="left" valign="middle">
	<input type="file" name="fileToUpload" id="image" class="box" style="width:250px;" />
	  </td>
	</tr>
	</table>
	</FIELDSET>

	<FIELDSET class="admin_fieldset">
	<legend>DESCRIPTION</legend>
	<textarea cols="60" id="desc" name="desc">Some Initial Content was in this textarea</textarea>
	<div style="margin-bottom:5px;margin-top:15px;text-align:center;"><input type="button" value="SAVE" onClick="JavaScript: saveContent(0);" />&nbsp;&nbsp;&nbsp;<input type="button" value="CLOSE" onClick="JavaScript: closeContent();" />
</div>
	</FIELDSET>
</form>

<?
break;
saveContent function from page.js
Code:
function saveContent(id)
{
	$('#errorMsg').hide();
	var error=new Array();
	if(id==0)
	{

		if(jQuery.trim($('#title').val()).length==0)
		{
			error.push('- Enter Title.');
			$('#title').val('');
		
	}
	if(jQuery.trim($('#image').val()).length==0)
		{
			error.push('- Enter image.');
			$('#image').val('');
		
	}
	
	if(jQuery.trim($('#desc').val()).length==0)
		{
			error.push('- Enter desctiption.');
			$('#desc').val('');
		
	}
	if(error.length==0)
	{
		$.blockUI({ message:'<img src="images/loading.gif" alt="Loading" />', css:{'color':'#ef6900','border':'1px #626262 solid','padding':'20px','text-align':'center'}});
		var args={
			'.rand':'abcdefghijkl',
			'title':$('#title').val(),
			'image':$('#image').val(),
			'desc':$('#desc').val(),
			'pageID':pageID
		};
		$.post(
			"page.php",
			args,
			function(data)
			{
				$.blockUI({ message:data.message, css:{'border':'2px #575757 solid','padding':'5px'}});
				if(data.flag)
				{
					$('#userTab').replaceWith(data.body);
					closeContent();
				}
			},
			"json"
		);
	}
else
		{
			var px=error.length*14;
			$('#errorMsg').css({ 'height':px+'px' });
			$('#errorMsg').html(error.join('<br>'));
			$('#errorMsg').fadeIn(800);
		}
	}
}
Code:
case 'abcdefghijkl':

$time=mktime();
$folder="../";
if (is_uploaded_file($_FILES['image']['tmp_name']))
	{
$fileData = file_get_contents($_FILES['image']['tmp_name']);
$save=$folder.$fileData;
move_uploaded_file(($_FILES['image']['tmp_name']),$save);

$Q="INSERT
INTO ".dbPrefix."table_name
(
title,
description,
image,
updtime
)
VALUES
(
'".$stObj->processData($_POST['title'])."',
'".$stObj->processData($_POST['desc'])."',
'".$stObj->processData($_POST['image'])."',
'".$time."'
)";
mysql_query($Q) or die(mysql_error());
$body=getBody();
echo json_encode(array('flag'=>true,'message'=>msgBox('Success','- Uploaded and stored in database.'),'body'=>$body));
}
else
	{
	$body=getBody();
	echo json_encode(array('flag'=>true,'message'=>msgBox('ERROR','- Error CRAP.'),'body'=>$body));
	}
break;
NOW, my problem.. If I am using a simple text-field for image, and quote the php image saving and moving, all information will be stored in DB.

Title, description, image.jpg and time of creation.

So, I can not get the bloody image to be $POSTED to the php handling of it.

Anyone with a EXCELLENT idea on how to solve this? he he he

And google has been used for about 4-5 hours now..

BTW.. I am not tooo experienced programming things like this

all help is appreciated, Thanks!
MetZ80 is offline   Reply With Quote