Wie kann die ausgewählte Option dynamisch geändert und ohne Nachladen aktualisiert werden?

Question

Es war schwierig, Begriffe für eine gute Suche zu finden (also bitte entschuldigen Sie, wenn das Thema bereits besprochen wurde) sowie einen expliziten Titel für diesen Beitrag.

Ich arbeite an dieser externen Webseite: https://espacepersonnel.bnf.fr/views/mes_notices.jsf (müssen protokolliert werden) und ich versuche, die standardmäßig ausgewählte Option mit der, die Wert = "0" zu überschreiben. Der benutzerdefinierte js-Code, den ich geschrieben habe, sendet das Formular aber erst, nachdem die Seite geladen wurde. Nichtsdestotrotz möchte ich vorher den Auswahlwert ändern.

Hier ist der betreffende Teil des Codes dieser Seite (das kann ich natürlich nicht bearbeiten):

<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> 

Und hier ist meine eigene ‚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); 
    } 

Können Sie eine Lösung finden für mich ? (Besser, wenn nur JS)

Vielen Dank für das Lesen dieses Beitrags und die Beantwortung, wenn Sie können.

Bigindian.

PS: Verzeihen Sie mein Englisch

NB: Seite Ergebnis:

result page

Answer 1

Sie können Folgendes versuchen:

• einen Verweis auf die Auswahl
• Schleife erhalten über seine Optionen
• Wenn der Wert der Option '0' ist, wählen Sie sie aus. Andernfalls deaktivieren Sie es.

Beispielcode:

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