Upload image using PHP and AJAX

[scorpionz]

Hi this is scorpionz
Any response will be appreciated with great interest,
can anyone have an idea regarding image upload through PHP+Ajax, i m using mysql as a db.
Like the Process i want to do is that:
I have create a field of image_name in DB table and just storing a name of image,

now when i press Button of Upload
It Should not refresh page and save image name to DB and load that image to folder that created at server side in Project folder

Anyone have any idea regarding how to do that with Ajax and PHP?
I will be thankful

Regards
scorpionz

[slacke]

I don´t know ajax, but I did the same with any file to upload. I had to upload some things to my server and I want to use the php for this.
I made an index.php with form creation and an upload.php what uploads the file.
In the web directory I created directory called data with 777 access rights and upload everithing in this directory.

[somedude3488]

i'll write some code and see if i can get it to work. (i'm curious). i will let you know of the results.

[somedude3488]

use this site i found:

http://www.openjs.com/articles/ajax/ajax_file_upload/

it has the info you need

[scorpionz]

Hi i am back...after a long vacations
Now first of all Thanks a lot to "slacke" and "kkeith29" for responding to my started thread.

To slacke,
Well Mr.slacke, no problem, if you have no idea, regarding my started thread, may be the knowledge that i will share here will might helps you so....

To kkeith29,
Well Mr.kkeith29 thanks for providing this Web refernce , but according to my opinion, i dont think so it is an Ajax,.....
Because, the browser loading bar is stil running and i think frommy point of view, iframe is not an good practice to run with Ajax...
What is your opinion regarding this?
and this web reference, I am cofused to apply...
Any other reference or guide lines will be appreciated with reat interest....

Regards
Scorpionz

[fatihpiristine]

i have done this using framset and php code no needed ajax code. i ll send you the code soon but still need some modifications. uploading and db part works fine.

[scorpionz]

Thanks for Response back fatihpiristine

Yes Sure
I am waiting to see that...
When will u?

Regards
Scorpionz

[fatihpiristine]

<?php
include('../include/conn.php');
$Path = "../images/reference/";
$NoPic = "../images/nopic.jpg";
$Delimeter = "_";
$ImageName = $_REQUEST['ReferenceID'];
$Title     = $_REQUEST['Title'];
$ImageNo   = $_REQUEST['ImageNo'];
$RealName  = $_FILES[imgpath][name];
$ImageType = $_FILES[imgpath][type];
$ImageSize = $_FILES[imgpath][size];
$TempName  = $_FILES[imgpath][tmp_name];
$Error     = $_FILES[imgpath][error];

if ($RealName != '')
{
	$Extension = strtolower(substr(strrchr($RealName, '.'), 1));
	if($Extension == 'jpg' || $Extension == 'jpeg' || $Extension == 'gif' || $Extension == 'png')
	{
		if($ImageNo == '')
		{
			$ImageNo == 0;
		}
		else
		{
			$ImageNo = $_REQUEST['ImageNo'];
			$ImageNo++;
		}
		$TargetName = $ImageName . $Delimeter . $ImageNo . '.' . $Extension;
		@copy($_FILES[imgpath][tmp_name], $Path . $TargetName);
		$Insert = "insert into gallery (ReferenceID, ImageNo, ImageSource,ImageTitle) values(" . $ImageName . "," . $ImageNo .",'" . $TargetName . "','" . $Title . "')";

		mysql_query($Insert);
	}
	else
	{
		$Error = 'Gecersiz dosya tipi';
	}
}
	$SQL = "select * from gallery where ReferenceID=" . $_GET['ReferenceID'];
	$Query = mysql_query($SQL);
	unset($Gallery);
	unset($ImageID);
	while($Write = mysql_fetch_array($Query))
	{
		if($Write['ImageSource'] != '')
		{
			$Gallery[] = $Write['ImageSource'];
			$ImageID[] = $Write['ImageNo'];
			if($ImageNo == 0 || $ImageNo == '')
			{
				$ImageNo++;
			}
		}
	}

if($_REQUEST['Delete'] == "OK")
{
	$FileName = $_REQUEST['FileName'];
	$Delete = "delete from gallery where ReferenceID=" . $_GET['ReferenceID'] . " and ImageNo=" . $_GET['ImageID'];
	mysql_query($Delete);
	@unlink($Path.$FileName);

	unset($Gallery);
	unset($ImageID);
	$SQL = "select * from gallery where ReferenceID=" . $_GET['ReferenceID'];
	$Query = mysql_query($SQL);
	while($Write = mysql_fetch_array($Query))
	{
		if($Write['ImageSource'] != '')
		{
			$Gallery[] = $Write['ImageSource'];
			$ImageID[] = $Write['ImageNo'];
			if($ImageNo == 0 || $ImageNo == '')
			{
				$ImageNo++;
			}
		}
	}	
}
?>
<html>
<script language="javascript" src="../js/controls.js"></script>
<body topmargin="0" leftmargin="0" bgcolor="#363636">
<form method="post" action="uploadgallery.php?ReferenceID=<?php print $_REQUEST['ReferenceID']; ?>&ImageNo=<?php print $ImageNo; ?>" enctype="multipart/form-data">
  <div>
    <div style="position:absolute; left:5px; top:5px; color:#CCCCCC; float:left; width:480px">
		<strong>Galeri Resimleri</strong> <input name="ReferenceID" type="text" style="width:25px" disabled value="<?php print $_REQUEST['ReferenceID']; ?>">
		<input name="ImageNo" type="text" style="width:25px" disabled value="<?php print  $ImageNo;; ?>">
		<br /><span style="font-size:12px; font-weight:bolder; color:#336699">Yuklemek istediginiz resim dosyasini secin; sadece JPEG, GIF ve PNG dosyalari</span> <br/>
        <input type="file" name="imgpath" style="width:215px"><input name="submit" type="submit" value="Yukle" style="width:85px;"><br />
        <textarea name="Title" style="width:300px; height:70px"></textarea>
        <br/>
      <span style="font-size:12px; line-height:25px; font-weight:bolder; color:#336699;">Resimleri goruntulemek icin uzerine tiklayin</span>
      </p>
    </div>
    <div style="position:absolute; left:5px; top:165px;">
	<?php
	for ($i = 0; $i < $ImageNo; $i++)
	{
	?>
    <div style="width:40px; height:40px;">
    <img name="image" src="<?php if($Gallery[$i] == '') { echo $NoPic; } else { echo $Path . ($Gallery[$i]); } ?>" width="40" height="40">
    <?php
    if($Gallery[$i] != '')
	{
		print "<a style='padding-bottom:15px' onclick='return DeleteControl()' href=uploadgallery.php?Delete=OK&FileName=$Gallery[$i]&ReferenceID=" . $_REQUEST['ReferenceID'] . "&ImageID=$ImageID[$i]>Sil</a>"; 
	}
	
	?>    
    </div>
    
    <?php } ?>
    
	<pre><?php 	print_r($Gallery); ?></pre>
    </div>
  </div>
</form>
</body>
</html>

table structure
===============================
CREATE TABLE `gallery` (
`ImageID` int(11) NOT NULL AUTO_INCREMENT,
`ReferenceID` int(11) DEFAULT NULL,
`ImageNo` int(11) DEFAULT NULL,
`ImageSource` varchar(255) DEFAULT NULL,
`ImageTitle` varchar(255) DEFAULT NULL,
PRIMARY KEY (`ImageID`)
) ENGINE=MyISAM AUTO_INCREMENT=23 DEFAULT CHARSET=utf8;
==========================

here it is... it works fine now.. needs css modifications. thats all