Multiple File Options When Upload File in Input Accept Attribute - html

I want to show multiple file type option when upload the files.
I refer to this: http://jsfiddle.net/dirtyd77/LzLcZ/144/ .
It works great when only one type of file is appear on the option.
<p>Only show Excel (.xlsx) files...</p>
<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ID="fileSelect" runat="server" />
but it will show 'Custom Files' when it has multiple options. as shown in image below.
<p>Show .xls, .xlsx, .csv files...</p>
<input type="file" accept=".csv, .pdf" ID="fileSelect" runat="server" />
Is there any way to show multiple options (1row for PDF, 1row for image, 1row for Excel, etc) in the file type dropdown menu? Instead of showing 'Custom Files'?

hi i have tried this and worked
the problem was the space you have given between the .csv, .pdf
as i thought
<p>MY CUSTOM ONE</p>
<input type="file" accept="image/*,video/*,.pdf,.csv" ID="fileSelect" runat="server" />
here is your updated fiddle work
DEMO code working

Related

html input type file show all files in file dialog popup

I have an input that only accepts xls, xlsx and csv files but for some reason on windows the file picker dialog only displays xls files by default. Is there a way to make it show "all files" by default in the filter dropdown?
Here's how my input looks like
<input type="file" name="file" accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,text/csv" onChange={changeHandler} ref={fileInputRef} />
If I get you correct you are expecting it to accept only .xls, .xlsx and .csv, you need this:
<input id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />
Valid Accept Types:
For CSV files (.csv), use:
<input type="file" accept=".csv" />
For Excel Files 97-2003 (.xls), use:
<input type="file" accept="application/vnd.ms-excel" />
For Excel Files 2007+ (.xlsx), use:
<input type="file" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" />

Select all and paste into New Text Document (3)

Below is what I have come up with So far:
<input type="text" id="Copymachine" onclick="select_all(this)" class="text-center form-control" placeholder="username:password">
I have a button. I can select the text I want from the page, but can not figure out how to now, copy to clip board and paste from clipboard to "New Text Document (3)" a .txt file on my desktop.
In other words I want to be able to click the text thats generate and in one click, highlight it and paste it into a .txt on the desktop.
I was going to add the Java tag. I am unfamiliar with web coding.
You can use this javascript snippet:
<input onClick="this.select();" value="Sample Text" />
But apparently it doesn't work on mobile Safari. In those cases you can use:
<input onClick="this.setSelectionRange(0, this.value.length)" value="Sample Text" />

HTML form to choose file only eBooks? {file-type}

I want to create a form using an upload "choose file" option. I would like to limit the files that display to show only .epub files and .mobi when the selecting pop up box on the OS opens. It should display only those type of files.
I got it to work with only images and only audio using the code below but how would I get the select pop up box to only display these two types of ebooks, .mobi and .epub?
Below is the image and audio code that works just fine.
Displays Image only files:
<input id="ImageuploadBtn" type="file" name="fileToUpload" class="upload" accept="image/x-png, image/gif, image/jpeg"/>
Displays Audio only files:
<input id="Mp3uploadBtn" type="file" name="fileToUpload" class="upload" accept="audio/mp3, audio/wav"/>
I believe it would be something like accept="ebook/epub" etc... but that does not work. Thanks for your help.
<input id="EbookuploadBtn" type="file" name="fileToUpload" class="upload" accept=".epub, .mobi"/>

How to save image from HTML File-Element in a folder?

I have an element like this:
<input type="file" accept="image/*" id="fileAdd" name="image" size="30" />
How can I save the selected image in a folder inside the project?
You have to send your form values to .php file.
Look for "move_uploaded_file()" function in php or another example (there's a lot of it on stackoverflow)

Upload image by directly entering a image URL?

I have used a input file code to upload image to my wallpaper site..
<input type="file" name="img" id="img" />
Is there anyway to select a image without selecting image file..like entering URL to text box?
<input name="img" type="text" id="img" value="http://www.somesite.com/image.my.jpg" size="40" />
I tried its not working...please help me! Anyway to enter image url to text box except select browse button and selecting image file? help me i tries in different ways...
You will need to add support for this on 'somesite.com'. This is not something you can solve with HTML, it needs to be solved on the server-side.