FAQ：フォームにボタンを追加したい
## 回答
「[スクリプト](/manual/table-management-script)」でボタンを追加します。
---
## 概要
分類Aなどの後ろやコマンドボタンエリアにボタンを追加するには「[スクリプト](/manual/table-management-script)」を使用します。
## 操作方法
1. 対象となるテーブルを開きの「管理」メニューから「[テーブルの管理](/manual/table-management)」を開きます。
2. エディタタブで分類Aを追加します。
1. スクリプトタブを開き「新規作成」ボタンをクリックし、「[タイトル](/manual/tenant-logo)」に任意のタイトルを入力し、「[スクリプト](/manual/table-management-script)」に下記のスクリプトを入力します。
1. 「出力先」を適宜設定します。
1. 「変更」ボタンをクリックしダイアログを閉じます。
1. 画面下部の「更新」ボタンをクリックします。
1. 任意のレコードを開くか、新規作成してください。
## サンプルコード
### 1. 分類Aの後ろにボタンを追加。ボタンデザインはhtmlのボタンタグ標準。
「出力先」は"新規"または"編集"（もしくは両方）に設定。
##### JavaScript
```
$p.events.on_editor_load = function () {
$('#' + $p.getField('ClassA')[0].id).after('<button type="button" style="float: left;">ボタン</button>');
};
```
### 2. コマンドボタンエリアにボタンを追加。ボタンデザインはプリザンターに準拠。
「出力先」は"新規"または"編集"（もしくは両方）に設定。
##### JavaScript
```
$p.events.on_editor_load = function () {
$('#MainCommands').append($('<button id=\"NewButton\">ボタン</button>').button({ icon: 'ui-icon-gear' }));
};
```
※「出力先」を"一覧"に設定した場合はイベント発火系スクリプトを`$p.events.on_grid_load`に変更してください。その他"カレンダー"や"クロス集計"を設定した場合も同様にイベント発火系スクリプトを設定した画面のものに変更してください。
※ボタンのアイコンは"ui-icon-○○"の形式で設定します。指定文字列は以下ページをご参照句獺祭。
[Icons \| jQuery UI API Documentation](https://api.jqueryui.com/theming/icons/)
## 関連情報
<div id="ManualList"><ul><li><a href="/manual/table-management">テーブルの管理</a><span>2023/04/19 up</span></li></ul></article>
<ul><li><a href="/manual/table-management-script">テーブルの管理：スクリプト</a><span>2023/05/18 up</span></li></ul></article>
<ul><li><a href="/manual/tenant-logo">テナント管理機能：ロゴ、タイトル、ロゴ画像</a><span>2024/04/11 up</span></li></ul></article></div><input id="SearchTextHidden" type="hidden" value="" />
