CODEWITHSUNDEEP
javascriptjqueryajaxlaravel
Kishan
Kishan

Reputation: 13

file upload using ajax in laravel

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)

Upvotes: 0

Views: 73

Answers (1)

Moslem_mh
Moslem_mh

Reputation: 189

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);
}

Upvotes: 2

Related Questions