/Javascript/jQuery/Upload preview image jquery

Upload preview image jquery

Jquery upload image

$(document).ready(function (e) {
    $('#imageUploadForm').on('submit',(function(e) {
        e.preventDefault();
        var formData = new FormData(this);

        $.ajax({
            type:'POST',
            url: $(this).attr('action'),
            data:formData,
            cache:false,
            contentType: false,
            processData: false,
            success:function(data){
                console.log("success");
                console.log(data);
            },
            error: function(data){
                console.log("error");
                console.log(data);
            }
        });
    }));

    $("#ImageBrowse").on("change", function() {
        $("#imageUploadForm").submit();
    });
});

Source: stackoverflow.com

Upload preview image jquery

// <input type="file" accept="image/*" id="img-input">
// <img id="preview"/>
function readURL(input) {
      if (input.files && input.files[0]) {
          var reader = new FileReader();
          reader.onload = function(e) {
          $('#preview').attr('src', e.target.result);
          }
          reader.readAsDataURL(input.files[0]);
      } else {
          $('#preview').attr('src', '');
      }
    }

  $("#img-input").change(function() {
    readURL(this);
  });

Similar codes

0 vote153 views1 answer
Jquery OR operator
Javascript jQuery
0 vote115 views1 answer
Go to page jquery
Javascript jQuery
0 vote121 views1 answer
Kendo jquery listview
Javascript jQuery
1 vote137 views1 answer
Jquery set attribute stack overflow
Javascript jQuery
1 vote114 views2 answers
Jquery on wheel event
Javascript jQuery
26 votes135 views4 answers
Jquery date
Javascript jQuery
18 votes126 views5 answers
Jquery ajax form submit example
Javascript jQuery
24 votes110 views3 answers
Round function in jquery
Javascript jQuery
0 vote128 views1 answer
Comparing html text by using jquery
Javascript jQuery
6 votes778 views1 answer
Jquery first child
Javascript jQuery