html ファイルアップロード枚数を制限したい

Question

ファイルアッルロードを複数選択できるように設定しているのですが
その選択上限枚数を10枚までしか選択できなくしたいです。

<input type="file" class="uploadFile" accept="image/*" multiple/>

phpにて
max_file_uploadsを利用すればphp側では制限できると思うのですが
html側で10枚までしか選択できなくすることは可能でしょうか？

Answer 1

javascriptでファイル数が取得できるので、fileのonchangeでイベント発火し、所定のファイル数を超えたらアラート出すとかsubmitボタンを非活性化するとかでどうでしょうか。（それでもHTMLは改ざん可能なので完全対応とはなりませんのでPHP側でも対応するのが前提ですが）

• 選択されたファイルの総数を求める

サンプル：

<form action="" method="post" enctype="multipart/form-data">
Files:<input type="file" name="files[]" id="select_file" accept="image/*" onchange="check();" multiple>
<input type="submit" value="submit">
</form>
<script>
function check(){
var fileList = document.getElementById("select_file").files;
alert("現在のファイル選択数："+fileList.length);
}

</script>

Comments

[amaguri]

なるほど！試して見たいと思います！

Answer 2

マルチプルをやめて10個のtype=fileのinputタグを用意してはいかがでしょうか？

Comments

[amaguri]

回答ありがとうございます、それを考えたのですが今回は制御してほしいと言われたので
次からは個数が決まっている場合は素直にその数のフォームを追加したいと思います！

Answer 3

http://www.openspc2.org/reibun/javascript2/FileAPI/files/0001/index.html

javascriptでチェックするぐらいでしょうか。

Comments

[amaguri]

回答ありがとうございます！やはりjavascriptにての動作になるんですね！