Change event function not working on input type file if file name is same

Question

This is my html code to upload excel file

 <span class="control-fileupload" >
      <label for="file1" class="text-left">{{filePlaceHolder}}</label>
      <input type="file" id="file1" value="" (change)="openFile($event)" >
 </span>

But the problem is if i'm uploading same file twice the change function is not executing again because there is no change in input field.

Suppose i have uploaded abc.xls file once and there are some validation on this file and if i change the content of abc.xls and re upload it then change function is not re validating it again.

What changes i should make to work change function every time i upload a file whether file name is same or not.

I want to know how to write this click function in type script as i'm new to this.

Possible duplicate of HTML input file selection event not firing upon selecting the same file — C3roe
– C3roe, Commented Oct 27, 2017 at 8:51
Or How to detect input type=file “change” for the same file? Please do some basic research before asking! — C3roe
– C3roe, Commented Oct 27, 2017 at 8:51
Problem is i need answer in angular 2 those solutions not working with angular 2 i already tried — user1881845
– user1881845, Commented Oct 27, 2017 at 8:53

guramidev · Accepted Answer · 2017-10-27 09:09:34Z

58

In angular 2 you can do it like this:

<span class="control-fileupload" >
      <label for="file1" class="text-left">{{filePlaceHolder}}</label>
      <input #fileInput type="file" id="file1" (click)="fileInput.value = null" value="" (change)="openFile($event)" >
 </span>

This way every time you click on file input it will clear it's value so even if you select the same file change will fire.

answered Oct 27, 2017 at 9:09

guramidev

2,2381 gold badge17 silver badges19 bronze badges

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

2 Comments

matt.writes.code Over a year ago

Thanks! How is this still a thing?!

Zaid Pathan Over a year ago

#fileInput & (click)="fileInput.value = null" value="" are the main parts.

Collectives™ on Stack Overflow

Change event function not working on input type file if file name is same

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related