2.1.28. ボタンウィジェット

ボタンウィジェットUI標準 UI部品 ボタン の内容に準拠したボタンを出力する。

本部品には以下のバリエーションがあり、必要に応じて使い分けること。

  • 戻るボタン <button:back>
  • キャンセルボタン <button:cancel>
  • 確認ボタン <button:check>
  • 確定ボタン <button:confirm>
  • 削除ボタン <button:delete>
  • 検索ボタン <button:search>
  • 更新ボタン <button:update>
  • 汎用ボタン <button:submit>
  • ダウンロードボタン <button:download>
  • ポップアップボタン <button:popup>
  • 閉じるボタン <button:close>

2.1.28.1. コードサンプル

設計成果物(ローカル動作)

<%-- 戻るボタンの場合 --%>
<button:back
  uri=""
  dummyUri="./W11AC0101.jsp"
  label="検索画面へ">
</button:back>

<%-- 汎用ボタンの場合 --%>
<button:submit
  uri   = ""
  dummyUri="./W11AB0101.jsp"
  label = "ログイン">
</button:submit>

<%-- ポップアップボタンの場合 --%>
<button:popup
    uri=""
    popupWindowName="W99ZZ6101"
    label="ポップアップ">
</button:popup>

実装成果物(サーバ動作)

<%-- 戻るボタンの場合 --%>
<button:back
  uri="/action/ss11AC/W11AC01Action/RW11AC0101"
  label="検索画面へ">
</button:back>

<%-- 汎用ボタンの場合 --%>
<button:submit
  uri   = "/action/ss11AA/W11AA01Action/RW11AA0102"
  label = "ログイン">
</button:submit>

<%-- ポップアップボタンの場合 --%>
<button:popup
    uri="/action/ss99ZZ/W99ZZ61Action/RW99ZZ6102"
    popupWindowName="W99ZZ6101"
    label="ポップアップ">
</button:popup>

2.1.28.2. 仕様

ローカル動作時の挙動

ボタンクリック時、dummyUrlで指定されたJSPファイルに遷移する。

属性値一覧 [ 必須属性 任意属性 × 無効(指定しても効果なし)]

名称 内容 タイプ サーバ ローカル 備考
共通属性
id htmlのid属性 文字列  
label ボタンの文言 [1] 文字列  
uri 遷移先のuri 文字列 × <button:close>は指定不可
disabled サーバに対する入力値の送信を 抑制するかどうか 真偽値 デフォルトは ‘false’
size ボタンの表示サイズ(Grid数) 数値 デフォルトは ‘3’
(<button:download> のみデフォルト ‘5’)
cssClass HTMLのclass属性値 文字列  
dummyUri ローカル動作時の遷移先 文字列 × <button:close>は指定不可
comment ボタン押下時のイベント概要 文字列 × × 画面項目定義のイベント一覧で、 画面イベント概要に表示される
共通属性(ポップアップを除く)
allowDoubleSubmission 二重サブミットを許容するか否か 真偽値 × デフォルトは ‘true(許容する)’
(<button:confirm> のみデフォルト ‘false(許容しない)’)
ポップアップ・汎用ボタンのみの属性
icon ボタンに表示するアイコン 文字列 iconのあるボタンとの高さは必要に応じて調整すること。
ポップアップボタンのみの属性
popupWindowName ウィンドウ名 文字列 デフォルトは ‘subwindow’ [3]
popupOption ウィンドウを開く際のオプション 文字列  
特定ボタン固有の属性
lockTarget 排他制御対象となるテーブル名を指定する。 文字列 × × 画面項目定義のイベント一覧で、排他制御対象に表示される[2]
[1]

以下のボタンはlabelの指定がない場合、デフォルト値(括弧内の値)が表示される。 任意の値をラベルに出力したい場合には、明示的にlabelを指定すること。

  • 戻るボタン(戻る)
  • キャンセルボタン(キャンセル)
  • 確認ボタン(確認)
  • 確定ボタン(確定)
  • 削除ボタン(削除)
  • 検索ボタン(検索)
  • 更新ボタン(更新)
  • 閉じるボタン(閉じる)
[2]

lockTarget属性が指定可能なボタンタグは以下のとおり。

  • 確認ボタン
  • 確定ボタン
  • 更新ボタン
  • 削除ボタン
  • 汎用ボタン
  • 検索ボタン
  • ダウンロードボタン
  • ポップアップボタン
[3]明示的にウィンドウ名を指定しない場合、1つの画面から開かれるポップアップウィンドウは1つに固定される。 すなわち、複数回ポップアップウィンドウを開いた場合、以前に開いたウィンドウが開かれたままであれば 新たなウィンドウは開かずに既存のウィンドウの内容のみを更新する。 複数のサブウィンドウを開きたい場合は、それぞれ個別のウィンドウ名を設定すること。

2.1.28.3. 内部構造・改修時の留意点

部品一覧

パス 内容
/WEB-INF/tags/widget/button/*.tag ボタンウィジェット
/js/jsp/taglib/nablarch.js

ボタンウィジェットが使用する以下タグのエミュレーション機
能を実装するタグライブラリスタブJS

  • n:button
  • n:popupButton
  • n:downloadButton
/css/style/base.less 基本HTMLの要素のスタイル定義。
ボタンに関する定義もここに含まれる。