jquery upload image

1$(document).ready(function(){
2
3    $("#but_upload").click(function(){
4
5        var fd = new FormData();
6        var files = $('#file')[0].files[0];
7        fd.append('file',files);
8
9        $.ajax({
10            url: 'upload.php',
11            type: 'post',
12            data: fd,
13            contentType: false,
14            processData: false,
15            success: function(response){
16                if(response != 0){
17                    $("#img").attr("src",response); 
18                    $(".preview img").show(); // Display image element
19                }else{
20                    alert('file not uploaded');
21                }
22            },
23        });
24    });
25});

1$(document).ready(function (e) {
2    $('#imageUploadForm').on('submit',(function(e) {
3        e.preventDefault();
4        var formData = new FormData(this);
5
6        $.ajax({
7            type:'POST',
8            url: $(this).attr('action'),
9            data:formData,
10            cache:false,
11            contentType: false,
12            processData: false,
13            success:function(data){
14                console.log("success");
15                console.log(data);
16            },
17            error: function(data){
18                console.log("error");
19                console.log(data);
20            }
21        });
22    }));
23
24    $("#ImageBrowse").on("change", function() {
25        $("#imageUploadForm").submit();
26    });
27});
28