xf : select1의 항목을 "테이블 방식"으로 표시

Question

Orbeon을 사용하여 펑키 한 작업을 시도하고 XForms를 생성합니다. select1의 항목을 테이블의 다른 열에 표시하고 싶습니다. xf : repeat는 select1 내에서 반복되어야하므로 사용할 수 없습니다.

설명하기 위해, 내가 가장 좋은 색상 인 여러 차종을 물어보고 싶다고 가정 해 봅시다. 그리고 저는이 질문들을 표 형식으로 보여주고 싶습니다. TR에있는 차와 td에있는 각 색 항목에 대한 각각의 질문이 표시됩니다. 나는 더러운 완벽한 세상에서 어떻게 할 것인지 여기
는 :

<xhtml:table> 
     <xf:repeat nodeset="/cars">    
     <xhtml:tr> 
      <xhtml:td><xf:output ref="car/name"/><xh:td/> 
      <xf:select1> 
       <xhtml:td><xf:item>Blue</xf:item></xhtml:td> 
       <xhtml:td><xf:item>Green</xf:item></xhtml:td> 
       <xhtml:td><xf:item>Yellow</xf:item></xhtml:td> 
       <xhtml:td><xf:item>Red</xf:item></xhtml:td> 
      </xf:select1> 
     </xhtml:tr>   
     </xf:repeat>  
</xhtml:table> 

그러나 나는 XF를 사용할 수 없기 때문에이 작동하지 않을 수 있습니다 XF에 내부 반복 : 선택 1을. XForms를 생성하고 CSS가 행과 열의 수에 따라 달라지기 때문에 CSS 만 사용할 수 없습니다 (자동차 수와 색상 수가 변경 될 수 있음) ... 그래서 CSS도 생성해야합니다 (어쩌면 그것은 옳은 길입니다 ...) ... 아무도 아이디어?

<xf:instance id="cars"> 
<cars xmlns=""> 
    <car> 
     <name>Car 1</name> 
     <is-blue></is-blue> 
     <is-green></is-green> 
     <is-yellow></is-yellow> 
     <is-red></is-red> 
    </car> 
    <car> 
     <name>Car 2</name> 
     <is-blue></is-blue> 
     <is-green></is-green> 
     <is-yellow></is-yellow> 
     <is-red></is-red> 
    </car> 
    .../... 
</cars> 

당신은 다음을 할 수 있습니다 : 나는 각 선택과 같은 자신의 노드에 살고있는 것입니다있는 인스턴스를 사용하는 것보다 다른 솔루션이 표시되지 않는 순수, 휴대용 XForms를 사용

Answer 1

<xf:select1><td> 각 : 물론

<xf:repeat nodeset="car"> 
<tr> 
    <td><xf:output ref="name"></xf:output></td> 
    <td> 
     <xf:select1 ref="is-blue" appearance="full"> 
      <xf:label></xf:label> 
      <xf:item> 
       <xf:label>Blue</xf:label> 
       <xf:value>yes</xf:value> 
      </xf:item> 
     </xf:select1> 
    </td> 
    <td> 
     <xf:select1 ref="is-green" appearance="full"> 
      <xf:label></xf:label> 
      <xf:item> 
       <xf:label>Green</xf:label> 
       <xf:value>yes</xf:value> 
      </xf:item> 
     </xf:select1> 
    </td>... 

당신은 그들에 선택하면 다른 선택을 해제하는 작업을 추가해야합니다. 원본 인스턴스를 유지하려면 이러한 컨트롤에 대한 보조 인스턴스를 사용하고이 두 인스턴스를 동기화하기위한 작업을 작성해야합니다.

나는이 글을 쓰는 것이 재미있을 것이라고 말하지 않겠지 만 이것이 가능하다는 것은 의심의 여지가 없다.

구현 트릭을 사용하는 것을 두려워하지 않는다면, 선호하는 구현 (이 경우 Orbeon)에 의해 생성 된 HTML을 표로 표시하여 표로 표시 할 수 있습니다.

이렇게하려면 컨트롤을 작성해야하며 생성 된 내용과이 마크 업을 사용하여 달성하려는 프레젠테이션을 얻을 수있는 방법을 확인하십시오. 당신의 컨트롤이있는 경우

예를 들어

:

<xf:repeat nodeset="car"> 
<div class="table"> 
    <xf:select1 ref="color" appearance="full"> 
     <xf:label ref="../name"></xf:label> 
     <xf:item> 
      <xf:label>Blue</xf:label> 
      <xf:value>blue</xf:value> 
     </xf:item> 
     <xf:item> 
      <xf:label>Green</xf:label> 
      <xf:value>green</xf:value> 
     </xf:item> 
     <xf:item> 
      <xf:label>Yellow</xf:label> 
      <xf:value>yellow</xf:value> 
     </xf:item> 
     <xf:item> 
      <xf:label>Red</xf:label> 
      <xf:value>red</xf:value> 
     </xf:item> 
    </xf:select1> 
</div> 

다음은 트릭을 할 것 CSS 규칙을 다음

<style type="text/css"> 
.table{ 
    display:table; 
} 

.table .xforms-select1{ 
    display:table-row; 
} 

.table .xforms-select1 *{ 
    display:table-cell; 
}</style>