JSF 2.0 (Sun Mojarra)에서 탭 패널 구성 요소를 얻는 방법

JSF 2.0 (Sun Mojarra)을 배우고 사용하고 있으며 웹 응용 프로그램에서 탭 패널을 원합니다 (단일 탭의 이름은 General, Detail1 , Detail2, ...).JSF 2.0 (Sun Mojarra)에서 탭 패널 구성 요소를 얻는 방법

어떻게해야합니까? 지금까지 이것에 대한 어떤 documetation를 발견하지 않았습니다 :(

출처

2010-08-16 Tim

다른 사람들은 이미 그것을 암시했습니다. Mojarra는 JSF 구현입니다. 기존 HTML 요소 (양식, 입력 필드 및 표)의 대부분을 포괄하는 필수 구성 요소 집합을 제공합니다. HTML은 단일 요소에 탭 패널을 제공하지 않으므로 기본 JSF 구현은이를 수행하지 않습니다.

기본적으로 탭 패널은 링크 (또는 버튼)와 패널을 숨기거나 표시하도록 전환하는 것입니다. 링크를 나타 내기 위해 일반적으로 HTML <a> 요소를 사용합니다. 패널을 표시하려면 대개 HTML <div> 요소를 사용합니다. 쇼를 전환하려면/하나 기본적으로 2 가지 방법이 있습니다 숨기기 :

인쇄 응답에 대한 모든 패널하지만, CSS display: none를 사용하는 다른 모든 패널을 숨기 display: block과 이전에 새로운 패널을 설정하여 가시성을 전환 자바 스크립트를 사용 패널은 display: none입니다.
또는 조건에 따라 요청한 패널을 응답으로 인쇄하십시오. 어떤 패널이 요청되었는지는 링크 (또는 버튼)의 요청 매개 변수에 의해 결정될 수 있습니다. 여기

는 방법 1의 기본 copy'n'paste'n'runnable 예입니다 :

<!DOCTYPE html> 
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html"> 
    <h:head> 
     <title>SO question 3491969</title> 
     <script src="http://code.jquery.com/jquery-latest.min.js"></script> 
     <script> 
      $(document).ready(function() { 
       $('#tabs a').click(function() { 
        $('#panels').children().hide(); 
        $($(this).attr('href')).show(); 
       }); 
      }); 
     </script> 
     <style> 
      #tabs li { list-style-type: none; display: inline; border: 1px solid black; } 
      #panels { width: 600px; height: 400px; border: 1px solid black; } 
      .hide { display: none; } 
     </style> 
    </h:head> 
    <h:body> 
     <ul id="tabs"> 
      <li><a href="#panel1">panel1</a></li> 
      <li><a href="#panel2">panel2</a></li> 
      <li><a href="#panel3">panel3</a></li> 
     </ul> 
     <div id="panels"> 
      <div id="panel1">panel1 content</div> 
      <div id="panel2" class="hide">panel2 content</div> 
      <div id="panel3" class="hide">panel3 content</div> 
     </div> 
    </h:body> 
</html>

당신은 물론 <a> 등 <h:outputLink>에 의해 <h:panelGroup layout="block">에 의해 <div> 등을 대체 할 수 있지만, backing 빈이나 JSF 컴포넌트 트리로 바인드 할 필요가 없다면 일반 HTML도 완벽하게 유효하며 오버 헤드가 적다.

일부 목록을 기반으로 탭과 패널을 "동적으로"반복하려면 <ui:repeat>을 가져와야합니다. 또한 맛있는 것처럼 보이게하기 위해 CSS를 잘 던지는 것을 잊지 마십시오. 이것은 기본적으로 대부분의 작업이 들어가는 곳입니다.

이것은 기본적으로 PrimeFaces, RichFaces 및 IceFaces과 같은 타사 구성 요소 라이브러리가 수행하는 작업이기도합니다.그것들은 모든 반복적이고 눈을 사로 잡는 작업을 수행하는 단일 구성 요소에서 원하는 기능을 제공합니다. PrimeFaces는 예를 들어 <p:tabView>, RichFaces는 <rich:tabPanel>, IceFaces는 <ice:panelTabSet>입니다.

출처

2010-08-16 13:27:31 BalusC

기존 구성 요소 라이브러리를 사용하는 것이 좋습니다.

PrimeFaces이 효과를 추가 할 수있는 능력, 그리고 동적 콘텐츠와 TabView 있습니다.

을 구현하기 위해 instructions

출처

2010-08-16 09:36:31 Dejell

JSF는 내가 그렇게 부르는 경우에만 "백본"프레임 워크입니다. 상자 밖에서는 작성자의 의도대로 JSF가 거의 구성 요소를 제공하지 않습니다. 자신 만의 작업을하는 프레임 워크 (오랫동안 그들이 설정된 표준을 따르는 것처럼). 이제는 자신 만의 구성 요소를 작성하거나 PrimeFaces, ICEFaces, RichFaces 등의 구성 요소가 이미있는 프레임 워크를 사용할 수 있습니다.

출처

2010-08-16 09:55:01

JSF에는 여러 가지 유용한 탭 구성 요소를 제공하는 많은 유용한 구성 요소가 있습니다. RichFaces, IceFaces, OpenFaces (언급 한 PrimeFaces). 이들 각각은 상당히 완벽하며 일반적으로 혼합 및 일치시킬 수 없으므로 각각의 데모 사이트를보고 원하는 것을 선택하십시오. RichFaces가 마음에 들지만 Seam2의 기본값이기 때문에 JSF를 처음 배웠던 부분이기도합니다. 프레임 워크

출처

2012-06-05 18:50:30 idarwin

JSF 2.0 (Sun Mojarra)에서 탭 패널 구성 요소를 얻는 방법

답변

관련 문제