JSFおよびFaceletsでJavaScriptを使用する

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

  •  04-07-2019
  •  | 
  •  

質問

JavaScriptを使用して、JSF / Faceletsページの非表示の入力フィールドを操作したいと思います。ページが読み込まれたら、非表示フィールドをクライアントの色深度に設定する必要があります。

Faceletから：

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

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

JSFがページを処理するとき、もちろん要素のIDを変更します。 JavaScriptコードからこれらの要素を参照する最良の方法は何ですか？

役に立ちましたか？

解決

フォームのIDを設定すると、フォームが何であるかがわかります。その後、実際の要素IDを作成できるようになります。

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

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

フォームのIDフィールドを設定したくない場合、実行時に次のように見つけることができます：

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

他のヒント

生成されたhtmlソースを表示し、jsfがタグのid属性に指定したものを確認します。

まもなく命名規則がどのように機能するかがわかります。通常はFORMNAME：FIELDNAMEのようです

clientId を使用できます。 /UIComponent.html#getClientId(javax.faces.context.FacesContext） "rel =" nofollow noreferrer "> UIComponent.getClientId（FacesContext）。サンプルについては、こちらをご覧くださいコード。

関数findElementをグローバルに定義し、どこでも使用します

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'));">
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top