JSF 및 Facelets와 함께 JavaScript를 사용합니다

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

  •  04-07-2019
  •  | 
  •  

문제

JSF/FACELETS 페이지에서 javaScript를 사용하여 숨겨진 입력 필드를 조작하고 싶습니다. 페이지가로드되면 클라이언트의 색 깊이에 숨겨진 필드를 설정해야합니다.

내 직면에서 :

<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.getClientId (faceScontext). 보다 여기 샘플 코드의 경우.

전 세계적으로 함수 찾기를 정의하고 어디에서나 사용하십시오 

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