Verwenden von JavaScript mit JSF und Facelets

StackOverflow https://stackoverflow.com/questions/231377

  •  04-07-2019
  •  | 
  •  

Frage

Ich möchte JavaScript verwenden, um versteckte Eingabefelder auf einer Seite von JSF/Facelets zu manipulieren. Wenn die Seite geladen wird, muss ich ein verstecktes Feld auf die Farbtiefe des Clients einstellen.

Aus meinem Furelet:

<body onload="setColorDepth(document.getElementById(?????);">

<h:form>
  <h:inputHidden value="#{login.colorDepth}" id="colorDepth" />
</h:form>

Wenn JSF die Seite verarbeitet, ändert sich natürlich die IDs der Elemente. Was ist der beste Weg, um diese Elemente aus meinem JavaScript -Code zu verweisen?

War es hilfreich?

Lösung

Sie möchten die ID des Formulars festlegen, damit Sie wissen, was es ist. Dann können Sie die tatsächliche Element -ID konstruieren.

<body onload="setColorDepth(document.getElementById('myForm:colorDepth');">

<h:form id="myForm">
  <h:inputHidden value="#{login.colorDepth}" id="colorDepth" />
</h:form>

Wenn Sie das ID -Feld des Formulars nicht festlegen möchten, können Sie es zur Laufzeit finden, wie so:

<body onload="setColorDepth(document.getElementById(document.forms[0].id + ':colorDepth');">

Andere Tipps

Zeigen Sie die generierte HTML -Quelle an und sehen Sie sich an, was das JSF das ID -Attribut des Tags benannt hat.

Sie werden bald sehen, wie die Namenskonvention funktioniert. Es ist normalerweise wie Formname: Fieldname

Sie können die Steuerung verwenden Kunden ID wie zurückgegeben von Uicomponent.getClientid (FacesContext). Sehen hier für Beispielcode.

Definieren Sie eine Funktion findelement weltweit und verwenden Sie sie überall überall 

function findElement(elementId) {
        if(document.getElementById(elementId)) return elementId;
        for(var  i = 0; i < document.forms.length; i++) {
            if(document.getElementById(document.forms[i].id + ':' + elementId)) {
                return document.forms[i].id + ':' + elementId;
            }
        }
        return null;
    }


    <body onload="setColorDepth(findElement('colorDepth'));">
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top