XPage のレイアウトを指定します。
<xe:applicationLayout attributes>content</xe:applicationLayout>| カテゴリ | プロパティ |
|---|---|
| basics | binding、configuration、id、loaded、rendered、rendererType |
| イベント | onItemClick |
| styling | disableTheme、themeId |
ベストプラクティスは、カスタムコントロール内に 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">
<xe:applicationLayout id="applicationLayout1">
<xp:callback facetName="facet_2" id="callback2"></xp:callback>
<xp:this.facets><xp:callback facetName="facet_1" id="callback1"
xp:key="LeftColumn"></xp:callback></xp:this.facets>
<xe:this.configuration>
<xe:oneuiApplication
placeBarName="Welcome to the application"
productLogo="/xpagesui-logo.jpg" productLogoAlt="XPages UI logo"
productLogoHeight="50%">
<xe:this.footerLinks>
<xe:basicContainerNode>
<xe:this.children>
<xe:basicLeafNode label="IBM"
href="http://www.ibm.com">
</xe:basicLeafNode>
<xe:basicLeafNode label="Google"
href="http://www.google.com">
</xe:basicLeafNode>
</xe:this.children>
</xe:basicContainerNode>
</xe:this.footerLinks>
<xe:this.titleBarTabs>
<xe:pageTreeNode label="main" page="/main.xsp"></xe:pageTreeNode>
<xe:pageTreeNode label="mainview"
page="/mainview.xsp">
</xe:pageTreeNode>
</xe:this.titleBarTabs>
</xe:oneuiApplication>
</xe:this.configuration>
</xe:applicationLayout>
</xp:view><?xml version="1.0" encoding="UTF-8"?>
<xp:view xmlns:xp="http://www.ibm.com/xsp/core"
xmlns:xc="http://www.ibm.com/xsp/custom">
<xp:this.data>
<xp:dominoDocument var="document1" formName="main"></xp:dominoDocument>
</xp:this.data>
<xc:MyOneUILayout>
<xp:this.facets>
<xp:dataTable id="dataTable1" rows="30" xp:key="facet_1"
var="rowdoc"
value="#{javascript:return database.getAllDocuments()}">
<xp:column id="column1">
<xp:this.facets>
<xp:span xp:key="header">
<xp:span style="font-weight:bold">
</xp:span>
<xp:label value="Existing subjects" id="label2"
style="color:rgb(0,128,255);font-weight:bold">
</xp:label>
<xp:span style="font-weight:bold">
</xp:span>
</xp:span>
</xp:this.facets>
<xp:text escape="true" id="computedField1">
<xp:this.value><![CDATA[#{javascript:return rowdoc.getItemValueString("subject")}]]>
</xp:this.value>
</xp:text>
</xp:column>
</xp:dataTable>
<xp:panel xp:key="facet_2" style="height:173.0px">
<xp:label value="Create a new subject" id="label1"
style="font-weight:bold;color:rgb(0,128,255)">
</xp:label>
<xp:br></xp:br>
<xp:table>
<xp:tr>
<xp:td>
<xp:label value="Category:"
id="category_Label1" for="category1">
</xp:label>
</xp:td>
<xp:td>
<xp:inputText value="#{document1.category}"
id="category1">
</xp:inputText>
</xp:td>
</xp:tr>
<xp:tr>
<xp:td>
<xp:label value="Subject:"
id="subject_Label1" for="subject1">
</xp:label>
</xp:td>
<xp:td>
<xp:inputText value="#{document1.subject}"
id="subject1">
</xp:inputText>
</xp:td>
</xp:tr>
<xp:tr>
<xp:td>
<xp:label value="Number:" id="number_Label1"
for="number1">
</xp:label>
</xp:td>
<xp:td>
<xp:inputText value="#{document1.number}"
id="number1">
<xp:this.converter>
<xp:convertNumber></xp:convertNumber>
</xp:this.converter>
</xp:inputText>
</xp:td>
</xp:tr>
<xp:tr>
<xp:td></xp:td>
<xp:td>
<xp:button value="Submit" id="button1">
<xp:eventHandler event="onclick"
submit="true" refreshMode="complete" immediate="false"
save="true" id="eventHandler1">
</xp:eventHandler>
</xp:button>
<xp:button value="Cancel" id="button2">
<xp:eventHandler event="onclick"
submit="true" refreshMode="complete" immediate="true"
save="false" id="eventHandler2">
</xp:eventHandler>
</xp:button>
</xp:td>
</xp:tr>
</xp:table>
</xp:panel>
</xp:this.facets>
</xc:MyOneUILayout>
</xp:view>