inPlaceForm - インプレースフォーム

動的フォームを組み込みます。

カテゴリ

拡張ライブラリ

構文

<xe:inPlaceForm attributes>content</xe:inPlaceForm>

表 1. 必須プロパティ
プロパティ	説明
id	デフォルトは `inPlaceForm1`、`inPlaceForm2` などです。

表 2. すべてのプロパティ
カテゴリ	プロパティ
basics	binding、id、loaded、partialEvents、rendered、rendererType
イベント	afterContentLoad、beforeContentLoad
styling	disableTheme、themeId

使用法

このコントロールは、他のコントロールのコンテナとして機能する動的フォームを定義します。

サーバーサイドのスクリプトでフォームを表示にするには、以下のコードを実行します。ここで、inPlaceForm1 はコントロール ID です。

getComponent("inPlaceForm1").show()

フォームを非表示にするには、以下のコードを実行します。

getComponent("inPlaceForm1").hide()

現在の状態に応じてフォームの表示/非表示を切り替えるには、以下のコードを実行します。

getComponent("inPlaceForm1").toggle()

詳しくは、インプレース編集を参照してください。

このコントロールは、最新のアクセシビリティ標準に対してテストされていません。推奨されるアクセシビリティパスはデータ表またはデータビューコントロールです。

例

以下に示すビューベースの繰り返しコントロールには、計算結果フィールド、リンク、動的フォームが含まれています。動的フォームには、編集ボックスとボタンが含まれています。計算結果フィールドには、ビュー内の各行の件名列が表示されます。行のリンクをクリックすると、その行の件名データに編集ボックスがバインドされた動的フォームが表示されるか、表示モードになっている場合は動的フォームが非表示になります。フォームが表示モードになっている場合は、ユーザーが編集ボックス内のデータを変更できます。ボタンをクリックすると、データが保存され、動的フォームが非表示になります。

<xp:this.data>
	<xp:dominoView var="view1" viewName="subject"></xp:dominoView>
</xp:this.data>
<xp:repeat id="repeat1" rows="30" value="#{view1}" var="row">
	<xp:text escape="true" id="computedField1" value="#{row.subject}"></xp:text>
	<xp:link escape="true" id="link1"><xp:this.text>
		<![CDATA[#{javascript:var c = getComponent("inPlaceForm1")
if(c.isVisible()) {
	return "Close";
} else {
	return "Edit"
}}]]></xp:this.text>
		&#160;
		<xp:eventHandler event="onclick" submit="true"
			refreshMode="partial" refreshId="repeat1">
			<xp:this.action>
				<![CDATA[#{javascript:getComponent("inPlaceForm1").toggle()}]]>
			</xp:this.action>
		</xp:eventHandler>
	</xp:link>
	<xp:br></xp:br>
	<xp:panel>
		<xe:inPlaceForm id="inPlaceForm1" partialEvents="true">
			<xp:inputText id="inputText1" value="#{document1.subject}"></xp:inputText>
			&#160;
			<xp:button value="OK" id="button1">
				<xp:eventHandler event="onclick" submit="true"
					refreshMode="partial" refreshId="repeat1">
					<xp:this.action>
						<xp:actionGroup>
							<xp:saveDocument></xp:saveDocument>
							<xp:executeScript>
								<xp:this.script>
									<![CDATA[#{javascript:getComponent("inPlaceForm1").hide()}]]>
								</xp:this.script>
							</xp:executeScript>
						</xp:actionGroup>
					</xp:this.action>
				</xp:eventHandler>
			</xp:button>
		</xe:inPlaceForm>
		<xp:this.data>
			<xp:dominoDocument var="document1" action="editDocument"
				documentId="#{javascript:row.getNoteID()}" formName="main">
			</xp:dominoDocument>
		</xp:this.data>
	</xp:panel>
</xp:repeat>