How to allow PDF file uploads on iOS?

Question

The Problem

I've built an HTML web form for the purpose of uploading files. When accessed from an iOS device, non-image files (.pdf, .docx, etc.) appear greyed-out when the "Browse" button is chosen to select a file from the iOS file explorer.

I have a fully-featured page (HTML, CSS, JS, PHP), but I've stripped the whole page down to the simplest form element to test functionality. Here's an example of code that does not work on my server (this is all that's in the HTML file besides the boilerplate tags), when viewed on a device running iOS 12.3:

<form action="" enctype="multipart/form-data" method="post">
   <input type="file" accept="image/*, .heic, .hevc, .heif, .pdf, .png, .gif, .jpg, .jpeg, .doc, .docx, image/png, image/jpg, image/jpeg, image/gif, application/msword, application/pdf" multiple>
</form>

You can see a similarly simple working example of non-image files being selectable from an iOS device with one of the W3School's "Try It" editors:

https://www.w3schools.com/tags/tryit.asp?filename=tryhtml5_input_type_file

What I've Tried

• SSL (extended validation)
• Apple technical support (referred to Apple Developer website after a couple hours on the phone)
• Multiple browsers (iOS Safari, iOS Chrome, iOS Google App)
• Multiple Apple devices (works on Mac, fails on iPhone and iPad)
• Competitive platforms (works on Android)
• iOS 13 beta (works)

The Question

Something is causing W3School's and other sites' servers to behave differently than mine when working with forms on iOS.

What is the factor on iOS that determines which sites/forms are able to select non-image files for an upload?

Answer 1

You must remove image/* and the other image/ file types.

<form action="" enctype="multipart/form-data" method="post">
   <input type="file" accept=".heic, .hevc, .heif, .pdf, .png, .gif, .jpg, .jpeg, .doc, .docx, application/msword, application/pdf" multiple>
</form>

Here is a sample of your code with my corrections: https://codepen.io/VladimirButakov/pen/XvXxGq?&editable=true

Answer 2

I made a web page that can get pdf files and send them to chats over a telegram bot. I opened the web page from my Iphone and just selected a pdf and sended it and it worked just fine.

The code I used for the input file is the following.

<form action="inviapdf.php" enctype="multipart/form-data" method="post" class="inputfile">
<input accept=".png, .jpg, .jpeg" class="bott" type="file" name="pdf"/>
<button>SendPDF</button>
</form>

I have an Iphone 7+ with latest IOS release. If I didn't answer your question can you be a bit more specific about it? thanks