Simon King
Simon King

Reputation: 195

Why multiple attribute in input tag of html is not working?

I can't seem to get the multiple tag working in my input. I am playing around with taking multiple photos, which will be incorporated into a health and safety form later on. At the moment all I can do is take one photo.

How am I using it incorrectly. I know it can be used with the type="file". I am hoping it is a simple syntax error

<!DOCTYPE html>
<html>
<body>

<h2>The multiple Attributes</h2>
<p>The multiple attribute specifies that the user is allowed to enter more than one value in the input element.</p>

<form action="/action_page.php">
  Take photos: <input type="file" accept="image/*" capture="camera" multiple><br>
  <input type="submit">
</form>

<p>I wonder how I can take more than one photo.</p>

<p><strong>Note:</strong> The multiple attribute of the input tag is not supported in Internet Explorer 9 and earlier versions.</p>

</body>
</html>

Upvotes: 2

Views: 3255

Answers (3)

errakeshpd
errakeshpd

Reputation: 2562

Your form should have attribute as 'enctype'. And the file input you should have an attribute as "multiple", that will do job for you.

Example:

    <form action="" enctype="multipart/form-data" method="post">
   <div><label for='upload'>Add Attachments:</label>
   <input id='upload' name="upload[]" type="file" multiple="multiple" />
   </div></form>

But I suggest you to use multiple file uploader like uploadify.

Upvotes: 2

Varun
Varun

Reputation: 306

method="POST" enctype="multipart/form-data"

You have missed enctype which will not upload file and method should be post

enctype(ENCode TYPE) attribute specifies how the form-data should be encoded when submitting it to the server. multipart/form-data is one of the value of enctype attribute, which is used in form element that have a file upload. multi-part means form data divides into multiple parts and send to server.

Upvotes: 1

channasmcs
channasmcs

Reputation: 1156

need to be like this

   <form action="/action_page.php"  method="POST" enctype="multipart/form-data">

 Take photos: <input type="file" name="files[]" type="file" multiple="multiple" accept="image/*" capture="camera" multiple><br>
 <input type="submit">
</form>

Upvotes: 2

Related Questions