1

I am working on a web page where user need to upload files and send them along with some message.. First thing i noticed is when we want to upload a file or send an attachment(single or multiple) we need to use below line of code:

<input type = "file" name="file" file-model="file" multiple/>

With the above code when user is selecting more than one file it is not showing the file names on the webpage instead showing 2 files if 2 files are selected. I want to show the file names and user should able to delete the file before sending if he likes to remove it before submitting the form(just like we do in email attachments).

sample plunker : https://plnkr.co/edit/Le6edwhX3Bye6E2XwIhd?p=preview

Any inputs on how to do it using angularjs.

georgeawg
  • 48,608
  • 13
  • 72
  • 95
user8373379
  • 77
  • 2
  • 8
  • Your PLNKR shows no effort. The JS file is empty. – georgeawg Jun 22 '18 at 23:20
  • See [How to POST binary files with AngularJS (with upload DEMO)](https://stackoverflow.com/questions/45432354/how-to-post-binary-files-with-angularjs-with-upload-demo/45433364#45433364) for a demo of how to select files in AngularJS and display their file names. – georgeawg Jun 22 '18 at 23:22

1 Answers1

0

I would recommend using BlueImp Angular File Uploader: https://blueimp.github.io/ It would allow you to do this along with other cool things like drag and drop and ajax uploading

Here's a demo: https://blueimp.github.io/jQuery-File-Upload/

Also, it looks like there's an Angular JS flavor of it: https://blueimp.github.io/jQuery-File-Upload/angularjs.html

Tom G
  • 3,650
  • 1
  • 20
  • 19