ブートストラップで入力タイプファイルが空の場合、ボタンを無効にします

Question

ユーザーがファイルをアップロードできるフォームがありますが、入力タイプファイルにファイルが含まれていない場合はアップロードボタンを無効にしますか？

<form action="/upload" method="post" enctype="multipart/form-data"> 
    <div class="form-inline"> 
     <div class="form-group"> 
      <input type="file" name="fileUploaded"> 
     </div> 
     <button type="submit" class="btn btn-sm btn-primary">Upload file</button> 
    </div> 
</form> 

Answer 1

あなたは私たちは、ボタン

<button type="submit" class="btn btn-sm btn-primary" disabled>Upload file</button> 

になり無効に属性を追加する必要がありますhttps://jsfiddle.net/IA7medd/08eekkbt/

：入力タイプのファイルは任意のファイル

$('input[type=file]').change(function(){ 
    if($('input[type=file]').val()==''){ 
     $('button').attr('disabled',true) 
    } 
    else{ 
     $('button').attr('disabled',false); 
    } 
}) 

ここでデモが含まれている場合、ボタンを有効にするためにコードを変更を見ます

Answer 2

Have a look here.

私は、リンクポストからこのソリューションが好き：

<input type="file" id="selectedFile" style="display: none;" /> 
 
<input type="button" value="Browse..." onclick="document.getElementById('selectedFile').click();" />