選択したオプションを動的に変更して再ロードせずに更新するにはどうすればよいですか？

Question

この記事の明示的なタイトルだけでなく、良い検索のための用語を見つけるのは難しいです。

https://espacepersonnel.bnf.fr/views/mes_notices.jsf（ログに記録する必要があります） 私はvalue = "0"のデフォルトで選択されたオプションをオーバーライドしようとしています。私が書いたカスタムjsコードは、ページがロードされた後でフォームを送信します。それにもかかわらず私は選択値を変更したいと思います。

<form id="noticeComp:mainForm" name="noticeComp:mainForm" method="post" action="/views/mes_notices.jsf" class="noticeForm" enctype="application/x-www-form-urlencoded"> 
    <input type="hidden" name="noticeComp:mainForm" value="noticeComp:mainForm"> 
    <input type="hidden" name="noticeComp:mainForm:j_idt253" value=""> 
    <input type="hidden" name="noticeComp:mainForm:j_idt254" value="false"> 
    <!-- <div id="site"> -->  
    <!-- <div class="moncatagen"> --> 
    <!-- <div class="col2"> --> 
    <h1 class="h1small"> 
     <span> 
      <select name="noticeComp:mainForm:j_idt256" size="1" onchange="submit()"> 
       <option value="0">Toutes les notices</option> 
       <option value="1" selected="selected">Notices biblio.</option> 
       <option value="2">Notices d'autorités</option> 
      </select>    
      Notices 
     </span> 
    </h1> 
</form> 

をそして、ここに私自身の「content_script」です：

ここでは、このページの懸念コードの一部です（それはもちろん私が編集することはできません）

var elm; 
var evt; 

elm = document.getElementsByName('noticeComp:mainForm:j_idt256')[0]; 
evt = document.createEvent("HTMLEvents"); 
evt.initEvent("change", false, true); 

    while(!document.getElementsByName('noticeComp:mainForm:j_idt256')[0].options[0].selected){ 
     document.getElementsByName('noticeComp:mainForm:j_idt256')[0].options[0].selected="selected"; 
     elm.dispatchEvent(evt); 
    } 

はあなたが解決策を見ることができますが私のために ？ （JSのみの方がよい場合）

ありがとうございました。

ビッグディアン。

PS： 結果ページ：：私の英語

NB恩赦

result page

Answer 1

をあなたは次のことを試すことができます。

• 選択
• ループへの参照を取得オプションの上に
• オプションの値が '0'の場合は、それを選択します。それ以外の場合は、選択を解除します。

例コード：

var elm = document.getElementsByName('noticeComp:mainForm:j_idt256')[0]; 
var evt = document.createEvent("HTMLEvents"); 
evt.initEvent("change", false, true); 

for (var i = 0; i < elm.options.length; i++) { 
    var option = elm.options[i]; 

    if (option.value === '0') { 
    option.setAttribute('selected', 'selected'); 
    } else { 
    option.removeAttribute('selected'); 
    } 
} 

elm.dispatchEvent(evt); 

function submit() { 
    // code 
    console.log('gogo'); 
} 

demo