セマンティックUIリセットフォーム（入力タイプのファイルフィールド）

Question

私はセマンティックUIを使用しており、全体的にはとても良いものでした。私は何か不安定なことに固執している、私はそれに入力タイプのファイルフィールドを持っているフォームがあります。今私は$("form").form("reset")私は次のエラーメッセージで遭遇しているフォームをリセットするはずです呼び出すとき。

Uncaught InvalidStateError: Failed to set the 'value' property on 'HTMLInputElement': This input element accepts a filename, which may only be programmatically set to the empty string. 

単純なリセットではいけませんか？私はここで何が欠けているのですか？私はそのような操作のためにセマンティックUIによって提供される機能に固執することを好むが、今のところ止まっている。私はあなたのエラーはどこから来る、しかしform('reset')はセマンティック-UI 2.1.8を使用して<input type='file'>に私のために正常に動作するかわからない、完全な例なし

Answer 1

。続く例を参照してください：

 
$(document).ready(function(){ 
 
    // initialize the form an fields 
 
    $('.ui.form') 
 
    .form({ 
 
    fields: { 
 
     fileInput:{ 
 
     identifier: 'name', 
 
     rules: [ 
 
      { 
 
      type : 'empty' 
 
      } 
 
     ] 
 
     } 
 
    } 
 
    }); 
 
}); 
 

 
function myOwnReset(){ 
 
    $('.ui.form').form('reset'); 
 
}

<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.1.8/semantic.min.js"></script> 
 

 
<form class="ui form segment"> 
 
    <div class="field"> 
 
    <label>File</label> 
 
    <input type="file" name="fileInput"></input> 
 
    </div> 
 
    <div class="ui blue submit button">Submit</div> 
 
    <div class="ui reset button">Reset</div> 
 
    <div class="ui clear button">Clear</div> 
 
</form> 
 

 
<input type="button" onClick="myOwnReset();" value="force form('reset')"></input>

私は<div class="ui reset button">Reset</div>に追加されたデフォルトReset機能を使用する例では。とにかく、強制的にform('reset')が期待通りに機能することを確認するボタンを追加しました。

は、コードがあなたが提示スニペット私はまだ通過し、私は見逃している可能性があるかどうか確認しなければならないという意味、仕事をする

Answer 2

これは、フォーム

<div class="ui clear button" onclick="$('.ui.form').form('clear')">Clear</div>