file upload using ajax in laravel

Question

I am using ajax to upload an image. I tried the following code:

My HTML:

<div class="row mr-0 ml-0 mt-2 justify-content-center d-flex">
  <div class="col-2 mr-0 pr-0 pl-1 mt-1">
    <label for="pancard_image">Pancard Front Image<span class="text-danger">*</span></label>
  </div>
  <div class="col-6 mr-0 pr-0">

    <input type="file" 
      class="dropify" 
      name="pancard_image"
      id="pancard_image"
      onchange="newfile()"
      required
      />
  </div>
</div>

My JavaScript:

var pancard = null;
function newfile()
{
  pancard = document.getElementById("#pancard_image").files[0];
  var image_name  = pancard.name;
  console.log(image_name);
}

I am testing is with console.log and it is giving me the following error:

register:1110 Uncaught TypeError: Cannot read property 'files' of null
  at newfile (register:1110)
  at HTMLInputElement.onchange (register:335)

Moslem_mh · Accepted Answer · 2020-06-02 04:05:59Z

2

the # before id is used in jquery but in javascript, you should use just id without #

var pancard = null;
function newfile()
{
  pancard = document.getElementById("pancard_image").files[0];
  var image_name  = pancard.name;
  console.log(image_name);
}

edited Jun 2, 2020 at 4:05

answered Jun 2, 2020 at 3:55

Moslem_mh

1891 silver badge8 bronze badges

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

Collectives™ on Stack Overflow

file upload using ajax in laravel

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related