2016-06-29 5 views
1

再利用可能なメニューカスタムコントロールを作成したいと思います。私はオブジェクトをそのTypeとして取るカスタムコントロールを構築しています。この電話番号はconfigurationです。Xpages:カスタムコントロールにJSONオブジェクトを渡してメニューを作成する

JSONオブジェクトをメニューに渡したいのですが、柔軟性のある構造になっています。 1つのレベルのコンテナを持つことができます。私はフラットなメニューを持っているかもしれませんが、そうであるように、サブメニューとねじれているかもしれません。

enter image description here

私は私の最初のレベルのメニューオブジェクトは、それが実際には(以下、「日付別」など)の容器であるべきかどうかを示すパラメータまたは最初のようなただのフラットメニュー(と、コンテナになります把握4つのメニュー)。ナビゲータコントロールでは、コンテナのプロパティが「透過」であるため、実際にコンテナにならない場合は設定できます。

私の問題は、JSONの解析です。 1つのレベル(つまりコンテナは使用できません)を実行できますが、複数のレベルを取得することはできません。

JSLintを介してJSONを実行しましたが、これは有効であると言いましたが、私がやりたいことに対して構築されていない可能性があります。

以下、私のコントロールとそれを呼び出すXpageを見つけ、JSONを渡します。

[Xpageでは、単にネストされた繰り返しを作成しようとしています。私は、私はかなり簡単にナビゲーターを作ることができると思うことを行うことができます。]

CC

<xc:ccMenu 
    xp:key="facetMenu"> 
    <xc:this.configuration><![CDATA[#{javascript:return 

[ 
{ 
    "cntNme": "Top Menu 1", 
    "cntType": "1", 
    "cntMnu": 
       { 
       "mnuNme": 

        [ 
         { "id": "1001", "type": "Regular" }, 
         { "id": "1002", "type": "Chocolate" }, 
         { "id": "1003", "type": "Blueberry" }, 
         { "id": "1004", "type": "Devil's Food" } 
        ] 

       } 

}, 

{ 
    "cntNme": "Top Menu 2", 
    "cntType": "1", 
    "cntMnu": 

       { 
       "mnuNme": 

         [ 
         { "id": "1001", "type": "Regular" }, 
         { "id": "1002", "type": "Chocolate" }, 
         { "id": "1003", "type": "Blueberry" }, 
         { "id": "1004", "type": "Devil's Food" } 
        ] 


       } 

}, 

{ 
    "cntNme": "Top Menu 3", 
    "cntType": "1", 
    "cntMnu": 

       { 
       "mnuNme": 

             [ 
         { "id": "1001", "type": "Regular" }, 
         { "id": "1002", "type": "Chocolate" }, 
         { "id": "1003", "type": "Blueberry" }, 
         { "id": "1004", "type": "Devil's Food" } 
        ] 
       } 

} 
] 

}]]></xc:this.configuration> 
</xc:ccMenu> 

のXPage

<?xml version="1.0" encoding="UTF-8"?> 
<xp:view 
    xmlns:xp="http://www.ibm.com/xsp/core" 
    xmlns:xe="http://www.ibm.com/xsp/coreex"> 
    <!--https://stackoverflow.com/questions/26168228/xpages-custom-control-with-custom-property-group-that-allows-multiple-instances--> 
     <xp:panel 
      tagName="h4"> 
      <xp:repeat 
       id="repeat1" 
       rows="30" 
       disableOutputTag="true" 
       value="#{compositeData.configuration}" 
       var="var" 
       indexVar="idx"> 
       <br></br> 
       <xp:text 
        id="computedField1" 
        value="#{var.cntNme}" 
        disableTheme="true"> 
       </xp:text> 
       <xp:panel 
        tagName="ul"> 
        <xp:repeat 
         id="repeat2" 
         rows="30" 
         disableOutputTag="true" 
         value="#{var.cntNme}" 
         var="var2" 
         indexVar="idx"> 
         <br></br> 
         <xp:text 
          id="computedField3" 
          disableTheme="true" 
          value="#{javascript:var2.cntMnu}"> 
         </xp:text> 
         <br></br> 
        </xp:repeat> 
       </xp:panel> 
      </xp:repeat> 
     </xp:panel> 
<xp:view> 
+0

JsonObjectに変換する必要があるかもしれません。https://www.ibm.com/support/knowledgecenter/en/SSEUEX_2.0.3/com.ibm .javaeuc.doc/com/ibm/json/java/JSONObject.html –

+0

繰り返し制御を使用する必要がありますか?目的が単なる表示であれば、私は何か違うものに解決します(結果はちょうど入れ子にされたリストです)。 http://jsfiddle.net/XE6Nw/ –

答えて

1
は、私は次の行を変更し

<?xml version="1.0" encoding="UTF-8"?> 
<xp:view 
    xmlns:xp="http://www.ibm.com/xsp/core" 
    xmlns:xe="http://www.ibm.com/xsp/coreex"> 
    <xp:panel 
     tagName="h4"> 
     <xp:repeat 
      id="repeat1" 
      rows="30" 
      disableOutputTag="true" 
      value="#{compositeData.configuration}" 
      var="var" 
      indexVar="idx"> 
      <br></br> 
      <xp:text 
       id="computedField1" 
       value="#{var.cntNme}" 
       disableTheme="true"> 
      </xp:text> 
      <xp:panel 
       tagName="ul"> 
       <xp:repeat 
        id="repeat2" 
        rows="30" 
        disableOutputTag="true" 
        value="#{var.cntMnu.mnuNme}" 
        var="var2" 
        indexVar="idx"> 
        <xp:text 
         id="computedField3" 
         disableTheme="true" 
         value="#{javascript:var2.type}"> 
        </xp:text> 
        <br></br> 
       </xp:repeat> 
      </xp:panel> 
     </xp:repeat> 
    </xp:panel> 
</xp:view> 

にカスタムコントロールを変更し

    value="#{var.cntMnu.mnuNme}" 

         value="#{javascript:var2.type}"> 

</xp:view> 

のXPageのリピートコントロールには、JavaScriptのオブジェクトと配列で完璧に動作します。それを他の何かに変換する必要はありません。

0

より基本的な例として、あなたはのXPagesのヘルプを見たいかもしれませんOpenNTF上のアプリケーション。 JSONを作成してdijit.Treeコントロールに渡し、階層メニュー構造を作成しました。 JSONは手動で作成されたもので、IBMによって作成されたJsonJavaObjectクラスとJsonParserクラス(接続メールの統合より前に作成されていた可能性があります)について知る前にありました。

関連する問題