웹 응용 프로그램 용 숫자 패널

Question

웹 응용 프로그램에 숫자 패널을 만들어야하지만 텍스트 영역에 단추의 값을 삽입 할 수있는 작업을 찾을 수 없습니다. 누군가 나를 도울 수 있습니까?

<p:commandButton value="1" id="btn1"></p:commandButton>      
<h:panelGrid id="grid" cellpadding="5" columns="1" > 
<p:inputText id="liczby" style="width:245px" /> 

나는 onclick 기능은 그렇게 할 수 읽었습니다하지만 난 그것을 사용하는 방법을 모르겠어요.

Answer 1

p : commandButton을 사용하여 서버의 Java Object 상태를 업데이트 한 다음 p : inputText를 해당 값에 바인딩 할 수 있습니다.

서버 요소에 대한 요청없이 button 요소가 DOM의 텍스트 요소를 즉시 업데이트하는 클라이언트 측 처리를 수행하는 것이 더 효과적 일 수 있지만, JSF를 선택하면 더 어려워집니다.

대상으로하는 뷰 요소의 동적으로 생성 된 ID를 안정적으로 예측할 수 없기 때문에 ID로 선택할 수 없습니다. 클래스를 사용하여 inputText를 선택하고 클라이언트 측의 값을 수정할 수 있습니다. 조금 어색하지만 작동해야합니다.

<p:commandButton onclick="document.getElementsByClassName('myUniqueClass')[0].value = this.value" /> 
<p:inputText styleClass="myUniqueClass" /> 

참고 :

• 당신은 프레젠테이션 내에서 그 기능을 선언하는 안티 패턴의로, 다른 곳에서 온 클릭 기능을 이동할 수 있습니다.
• 다른 요소 'myUniqueClass'의 이름을 지정하지 않으므로 예상 한 요소를 정확히 얻을 수 있습니다. 이것은 또한 약간의 반 패턴입니다. 나는 primefaces가 대신 ID를 정의하는 방법을 제공한다고 믿는다. 즉, 동적으로 생성 된 ID (즉, 현재 ID에 삽입 된 부모 요소 ID를 얻지 못한다)를 벗어날 수 있고, 이는이 안티 patterm을 해결하는 좋은 방법 일 것이다