clientStateTreeDataProxyクラスを使用して、対話型treeコンポーネントを作成します。このプロキシは、開くリンク先および閉じるリンク先を設定して、ツリーが開く状態と閉じる状態を管理します。プロキシ属性を使用して、ツリー・コンポーネント上で使用されるプロキシを設定します。
ノードが閉じている場合、expandDestinationキーに関連付けられている値がノードが開いた状態を表すリンク先として使用されます。ノードが開いている場合は、collapseDestinationキーに関連付けられている値がノードが閉じた状態を表すリンク先として使用されます。
clientStateTreeDataProxyを使用すると、ツリーの状態がクライアントで保持されます。プロキシは、ノードが開かれるとき、または閉じられるときに次の名前と値のペアがサーバーに送信されるよう、開くリンク先および閉じるリンク先を設定します。
event
= expand
source
= ツリー・コンポーネントのID
node
= 開くノードまたは閉じるノード
state
= 何が開いていて、何が閉じているかという点から見た現在のツリーの状態
selection
= 現在選択されているノード
eventの値は、UIX Servletのイベントの名前です。ノードが開いていても閉じていても、値はexpand
なので注意してください。sourceの値は、ID属性の値です。node
、state
およびselection
に関連付けられている値は、サーバー上で新規プロキシを作成するために使用されます。後述する例で示されるように、値を取得して、これらの値をコンストラクタに渡す必要があります。
ツリーを適切な状態に設定し、ツリーの状態としてnullが指定されたclientStateTreeDataProxyコンストラクタを使用することで、プロキシはノード・データから、開いているか閉じているかの状態の取得を試行します。後述する例で示されるように、デフォルトでツリーを特定のノードまで開いた状態にするには、ルートまでのパスとともにノードを開くよう設定する必要があります。
次の例ではJavaコードが必要です。このコードはUIX XMLコードの後に示されます。
Example:
<ctrl:page xmlns="http://xmlns.oracle.com/uix/ui"
xmlns:ctrl="http://xmlns.oracle.com/uix/controller"
xmlns:data="http://xmlns.oracle.com/uix/ui"
expressionLanguage="el">
<ctrl:content xmlns:ui="http://xmlns.oracle.com/uix/ui">
<body>
<contents>
<dataScope xmlns="http://xmlns.oracle.com/uix/ui">
<contents>
<!-- UIX Components -->
<form name="myForm" >
<contents>
<tree id="tree"
formSubmitted="true"
nodes="${data:data().Nodes.nodes}"
proxy="${TreeProxy.proxy}"/>
</contents>
</form>
</contents>
<!-- Data -->
<provider>
<data name="TreeProxy"><method class="oracle.cabo.doc.demo.DataTrees"
<method="getTreeProxy"/>
</data>
<data name="data:Nodes">
<inline>
<nodes text="店"
destination="http://www.oracle.com"
expandable="expanded">
<nodes text="本"
destination="http://www.oracle.com"
expandable="expanded">
<nodes text="セール"
destination="http://www.oracle.com"
expandable="expanded">
<nodes text="文庫"
destination="http://www.oracle.com" />
</nodes>
<nodes text="フィクション"
destination="http://www.oracle.com"/>
<nodes text="ノンフィクション"
destination="http://www.oracle.com"/>
</nodes>
<nodes text="ハードウェア"
expandable="expanded">
<nodes text="デスクトップ"
destination="http://www.oracle.com"/>
<nodes text="ノートブック"
destination="http://www.oracle.com"/>
</nodes>
</nodes>
</inline>
</data>
</provider>
</dataScope>
</contents>
</body>
</ctrl:content>
<!-- UIX Controller -->
<ctrl:handlers xmlns="http://xmlns.oracle.com/uix/controller">
<event name="expand">
<method class="oracle.cabo.doc.demo.DataTrees"
method="expandEventHandler"/>
</event>
</ctrl:handlers>
</ctrl:page>
次のコード例では、前述のUIX XMLコードで使用された2つのメソッドを示します。この後の例では、必ずこのメソッドを使用します。最初のメソッドは、プロキシを返すdataObjectを返すgetTreeProxyメソッドです。
Example:
public static DataObject getTreeProxy(
RenderingContext rc,
String ns,
String name)
{
return new TreeProxyDataObject(null);
}
private static class TreeProxyDataObject implements DataObject
{
public TreeProxyDataObject(
String submitURL
)
{
_submitURL = submitURL;
}
public Object selectValue(
RenderingContext rc,
Object key
)
{
BajaContext bc = BajaRenderingContext.getBajaContext(rc);
EventResult result = EventResult.getEventResult(bc);
Object proxy = (result==null) ? null : result.getProperty("proxy");
if (proxy==null)
proxy = new ClientStateTreeDataProxy( _submitURL, null, null, null);
return proxy;
}
String _submitURL;
}
expandEventHandler
メソッドは、expandイベントの発生時にこのイベントを処理します。expandEventHandler
では、state(UIConstants.STATE_PARAM
)、node(UIConstants.NODE_PARAM
)およびselection(UIConstants.SELECTION_PARAM
)の各パラメータに関連付けられている値を新規のClientStateTreeProxy
に渡すことに注意してください。この新規のプロキシは、コンテキストでプロパティとして設定された後、前述のメソッドで作成されたTreeProxyDataObject
によってデータ・ツリーへと返されます。
Example:
public static EventResult expandEventHandler(
BajaContext context,
Page page,
PageEvent event )throws Throwable
{
String state = event.getParameter(UIConstants.STATE_PARAM);
String node = event.getParameter(UIConstants.NODE_PARAM);
String selection = event.getParameter(UIConstants.SELECTION_PARAM);
EventResult result = new EventResult(page);
Object proxy = new ClientStateTreeDataProxy(null, state, node, selection);
result.setProperty("proxy", proxy);
return result;
}
ノードの選択状態は、selection
パラメータを受け取るコンストラクタが使用されている場合はプロキシで処理されます。現状では、プロキシでサポートされているのは1つのみです。表示されていない場合でも、ノードは(新規選択が行われるまで)選択されたままになります。選択の状態はonClickハンドラを介して処理されます。次の例では、nodeStampが使用されます。
注意: プロキシを使用しているときは、Netscapeでは選択することができません。
Example:
<ctrl:page xmlns="http://xmlns.oracle.com/uix/ui"
xmlns:ctrl="http://xmlns.oracle.com/uix/controller"
xmlns:data="http://xmlns.oracle.com/uix/ui"
xmlns:html="http://www.w3.org/TR/REC-html40"
expressionLanguage="el">
<ctrl:content xmlns:ui="http://xmlns.oracle.com/uix/ui">
<body>
<contents>
<dataScope xmlns="http://xmlns.oracle.com/uix/ui">
<contents>
<!-- UIX Components -->
<form name="myForm" >
<contents>
<tree id="tree"
formSubmitted="true"
nodes="${data:data().Nodes.nodes}"
proxy="${TreeProxy.proxy}">
<nodeStamp>
<flowLayout>
<contents>
<checkBox rendered="${uix.current.rendered}"
disabled="${uix.current.disabled}"
checked="${uix.current.checked}"/>
<link destination="${uix.current.destination}" text="${uix.current.text}"/>
</contents>
</flowLayout>
</nodeStamp>
</tree>
</contents>
</form>
</contents>
<!-- Data -->
<provider>
<data name="TreeProxy">
<method class="oracle.cabo.doc.demo.DataTrees"
method="getTreeProxy"/>
</data>
<data name="data:Nodes">
<inline>
<nodes text="店"
destination="http://www.oracle.com"
expandable="expanded"
rendered="false"
icon="/docs/devguide/images/data_trees/info.gif" >
<nodes text="本"
destination="http://www.oracle.com"
expandable="expanded"
rendered="false"
icon="/docs/devguide/images/data_trees/info.gif" >
<nodes text="セール"
destination="http://www.oracle.com"
expandable="expanded"
rendered="false"
icon="/docs/devguide/images/data_trees/info.gif">
<nodes text="文庫"
destination="http://www.oracle.com"
disabled="true" />
</nodes>
<nodes text="フィクション"
destination="http://www.oracle.com"
checked="true"/>
<nodes text="ノンフィクション"
destination="http://www.oracle.com"/>
</nodes>
<nodes text="ハードウェア"
expandable="expanded"
rendered="false"
icon="/docs/devguide/images/data_trees/info.gif" >
<nodes text="デスクトップ"
destination="http://www.oracle.com"/>
<nodes text="ノートブック"
destination="http://www.oracle.com"/>
</nodes>
</nodes>
</inline>
</data>
</provider>
</dataScope>
</contents>
</body>
</ctrl:content>
<!-- UIX Controller -->
<ctrl:handlers xmlns="http://xmlns.oracle.com/uix/controller">
<event name="expand">
<method class="oracle.cabo.doc.demo.DataTrees"
method="expandEventHandler"/>
</event>
</ctrl:handlers>
</ctrl:page>
ノードのチェック・ボックスがクリックされたときに、背景色とテキスト色が変更されます。
Copyright © 1997, 2004, Oracle. All rights reserved.