1.11M Members

PHP and AJAX image upload

 
0
 

i have a page for user registration where i a form with a image tag to it.
i want the user to fill the form but as soon as he uploads the image i want the image uploaded to be displayed on the image tag.
Then i want all these form values+image to be stored in the database.
or the form values on database and the image file somewhere on the disk.
i am attaching the screenshot.
I am using MySQl for database. and PHP
here is the page code

<!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>
<title>Untitled Document</title>
<link rel="stylesheet" href="outpass.css" />

</head>

<body>

 <form method="post" action="crt_stu_db.php">

          <div class="box">

            <h1>Outpass </h1>

            <label>

               <span>Full name: </span>

               <input type="text" class="input_text" name="name" id="name" />

            </label>

             <label>

               <span>Branch: </span>

               <input type="text" class="input_text" name="branch" id="branch"/>

            </label>

             <label>

                <span>Student Mobile No: </span>

                <input type="text" class="input_text" name="smobile" id="smobile" />

            </label>
            
            
            
            
             <label>

                <span>Enrollment No: </span>

                <input type="text" class="input_text" name="eno" id="eno" />

            </label>
            
            
            
             <label>

                <span>Hostel No: </span>

                <input type="text" class="input_text" name="hostel" id="hostel" />

            </label>
            
            <label>

                <span>Room No: </span>

                <input type="text" class="input_text" name="room" id="room" />

            </label>
            
            <label>

                <span>Father's/Gardian no: </span>

                <input type="text" class="input_text" name="fmobile" id="fmobile" />

            </label>
            
            
            <label>

                <span>Address: </span>
	
            <textarea class="address" wrap="off" rows='2' cols='2' name="address" > </textarea>              
             </label>
            
            <input name="student_image" style="position:absolute; top:100px; left:700px"  width="150" height="150" type="image" id="student_image" src="200x200.jpg" align="right" />
            <input name="image" id="stu_img" type="file" style="position:absolute;top:250px;left:700px; width:100px;" />
            
            
        </div>
</form>
</body>
</html>
Attachments ajax.png 31.02KB
 
0
 

Of course what you described is more complicated than the code provided, but this is not the problem, you can’t upload images through a real AJAX (theory sais that you could using techniques in few browsers) , that is the real problem, you could use iframes and javascript form manipulation (e.g. http://www.openjs.com/articles/ajax/ajax_file_upload/ ) on that or the well know SWFUpload (http://swfupload.org/ ).

 
0
 

Of course what you described is more complicated than the code provided, but this is not the problem, you can’t upload images through a real AJAX (theory sais that you could using techniques in few browsers) , that is the real problem, you could use iframes and javascript form manipulation (e.g. http://www.openjs.com/articles/ajax/ajax_file_upload/ ) on that or the well know SWFUpload (http://swfupload.org/ ).

Thanks mate :D
had to use iframe and blah blah....
http://tutorialzine.com/2011/09/html5-file-upload-jquery-php/
can you look at this page plzzz....
it stores the image i upload in a directory with the original image name....
as i am new to php i cant figure out how to change the image name that gets stored in the directory
or
how to store these images in MYSQL instead of that directory
plzz plzz plzz

 
1
 

I took a look at the script you chosen,
The first thing you are asking is done here ,

move_uploaded_file($pic['tmp_name'], $upload_dir.$pic['name'])

So…
http://php.net/manual/en/function.move-uploaded-file.php
(second argument , destination)
Of course in a quick pick of that script I didn’t shaw anything about security, or maybe there is somewhere on that (you could start from http://php.about.com/od/advancedphp/ss/php_file_upload.htm ).

The second thing you ask (to save the image in a MySql table) you must have reason to do that. I believe that there are really very few cases that this has a meaning , so few that I wouldn’t recommended it at all. If you insist on that you could google about it …
(e.g. http://bytes.com/topic/php/insights/740327-uploading-files-into-mysql-database-using-php)

 
0
 

I took a look at the script you chosen,
The first thing you are asking is done here ,

move_uploaded_file($pic['tmp_name'], $upload_dir.$pic['name'])

So…
http://php.net/manual/en/function.move-uploaded-file.php
(second argument , destination)
Of course in a quick pick of that script I didn’t shaw anything about security, or maybe there is somewhere on that (you could start from http://php.about.com/od/advancedphp/ss/php_file_upload.htm ).

The second thing you ask (to save the image in a MySql table) you must have reason to do that. I believe that there are really very few cases that this has a meaning , so few that I wouldn’t recommended it at all. If you insist on that you could google about it …
(e.g. http://bytes.com/topic/php/insights/740327-uploading-files-into-mysql-database-using-php)

You are Amazing man.....Thanks :D
i wanted to save the images of the student along with the other details..
but now i think i should store it on the disk itself.
I did it finally.
I stored the images according to the ""Enrollment No."" of students.... :D
thanks agan bro :D

Question Answered as of 2 Years Ago by jkon
You
This question has already been solved: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: