submit form automatically after select image from browse window while uploading image

Question

I want to upload image and want to store that image in database as well.But when i click on image to open browse file dialogue box the form already submited.But i want to submit form after i select image.

enter image description here

Here is my code

<form>

<input type="file" id="my_file" style="display:none;" />
<input type="image" src="albert-einstein-bike.jpg" width="90px" height="200" />
</form>

 <script>

$("input[type='image']").click(function() {
$("input[id='my_file']").click();
});
</script>

Nibin · Accepted Answer · 2013-10-22 05:08:14Z

4

Hope something like this might do it for you mate... :)

html

<div id='preview'></div>
    <form id="imageform" method="post" enctype="multipart/form-data" action='ajaximage.php'>
    <input type="file" name="photoimg" id="photoimg" />
     </form>

Script File

$('#photoimg').on('change', function() 
 {
      $("#imageform").ajaxForm({target: '#preview', //Shows the response image in the div named preview 
         success:function(){

         }, 
         error:function(){

          } 
       }).submit();
});

ajaximage.php

if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
{
$name = $_FILES['photoimg']['name'];
$size = $_FILES['photoimg']['size'];
$tmp = $_FILES['photoimg']['tmp_name'];
$path = "uploads/";
move_uploaded_file($tmp, $path.$name) //Stores the image in the uploads folder
}

edited Oct 22, 2013 at 5:08

answered Oct 22, 2013 at 4:39

Nibin

3,9602 gold badges22 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Shikhil Bhalla Over a year ago

brother i does not able to submit the form.plz check it

Shikhil Bhalla Over a year ago

Uncaught TypeError: Object [object Object] has no method 'live'

Nibin Over a year ago

use on instead of live mate.. :)

Shikhil Bhalla Over a year ago

Uncaught TypeError: Object [object Object] has no method 'ajaxForm'

Nibin Over a year ago

u might not have added the scripts properly.check if you have added jquery form.js <script src="http://malsup.github.com/jquery.form.js"></script>

Collectives™ on Stack Overflow

submit form automatically after select image from browse window while uploading image

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related