ショートカットキー
プリザンターには、作成・更新や「前」「次」ボタンなどの操作をキーボードで行えるショートカットキーが標準で用意されています。同じキーでも画面によって押されるボタンが変わる点に注意してください。公式マニュアルの説明は ショートカットキー を参照してください。
一覧
| 操作 | ショートカットキー | サイト画面 | 新規作成画面 | 編集画面 | 一覧画面 | サイト設定画面 |
|---|---|---|---|---|---|---|
| 上のサイトへ | ALT + q | ○ | ||||
| 「戻る」ボタンを押す | ALT + q | ○ | ○ | ○ | ○ | |
| 「作成」ボタンを押す | ALT + s | ○ | ||||
| 「更新」ボタンを押す | ALT + s | ○ | ○ | |||
| 「一括更新」ボタンを押す | ALT + s | ○ | ||||
| 「コピー」ボタンを押す | ALT + c | ○ | ○ | |||
| 「参照コピー」ボタンを押す | ALT + k | ○ | ||||
| 「移動」ボタンを押す | ALT + o | ○ | ||||
| 「一括移動」ボタンを押す | ALT + o | ○ | ||||
| 「メール」ボタンを押す | ALT + m | ○ | ○ | |||
| 「削除」ボタンを押す | ALT + r | ○ | ||||
| 「一括削除」ボタンを押す | ALT + r | ○ | ||||
| 「サイト削除」ボタンを押す | ALT + r | ○ | ||||
| 「インポート」ボタンを押す | ALT + w | ○ | ||||
| 「エクスポート」ボタンを押す | ALT + x | ○ | ||||
| 「前」ボタンを押す | ALT + b | ○ | ||||
| 「次」ボタンを押す | ALT + n | ○ |
キー別の早見表
| キー | 動作 |
|---|---|
| ALT + q | サイト画面では上のサイトへ移動、それ以外の画面では「戻る」 |
| ALT + s | 新規作成画面では「作成」、編集画面・サイト設定画面では「更新」、一覧画面では「一括更新」 |
| ALT + o | 編集画面では「移動」、一覧画面では「一括移動」 |
| ALT + r | 編集画面では「削除」、一覧画面では「一括削除」、サイト設定画面では「サイト削除」 |
仕組み(accesskey 属性)
ショートカットキーは、ボタンの HTML 標準の accesskey 属性で実装されています。JavaScript のキー操作のライブラリは使っていません。サーバーがボタンを出すときに accessKey を指定すると、accesskey 属性が付きます(HtmlAttributes.cs#L270-L278)。
<button id="UpdateCommand" accesskey="s" class="button button-icon …">更新</button>キーを押したときの修飾キーは、ブラウザと OS が決めます。上の表の「ALT + キー」は Windows の Chrome・Edge の場合です。Firefox は Alt + Shift + キー、macOS では Control + Option + キーなど、ブラウザによって違います(MDN の accesskey)。
上の表に無いボタン
確認したソースでは、ほかに次のボタンにも accesskey が付いています。
| キー | ボタン | 画面 |
|---|---|---|
| b / n | 前 / 次 | カレンダー・ガントチャート・クロス集計(HtmlCalendar.cs#L97-L106、HtmlGantt.cs#L68-L75) |
| n | 今月 | クロス集計。「次」と同じ n が付いている(HtmlCrosstab.cs#L104-L124) |
| x | エクスポート | クロス集計 |
| s | レイアウトの保存 | ダッシュボード(HtmlCommands.cs#L289-L292) |
| s | 一括更新の実行 | 一括更新のダイアログ(HtmlBulkUpdate.cs#L43) |
| s | 更新 | 一覧から「モーダルで開く」で開いた編集画面(HtmlEditor.cs#L55) |
| q | 戻る | バックグラウンドジョブの画面(HtmlBackgroundJobs.cs#L138) |
同じキーが 1 つの画面の複数のボタンに付いたとき(クロス集計の「次」と「今月」など)にどれが押されるかは、ブラウザによって違います。
ダイアログを開いているとき
$p.send と $p.get(「前」「次」「再読み込み」など)は、最初に $p.outsideDialog を呼びます。accesskey を持つボタンが、開いているダイアログの外にあれば、何もせずに終わります(_form.js#L33-L46、#L53、item.js#L3)。ダイアログの表示中に Alt + s を押すと、ダイアログ内の「更新」などは動き、裏の画面の「更新」は動きません。
Enter キーと Tab キー
keyevents.js には、ショートカットキーとは別に次の処理があります(keyevents.js)。
inputで Enter を押してもフォームは送信されません。data-enter属性を持つフォームの中では、その属性で指定したボタンがクリックされます(パスワードの変更・リセットのダイアログなど)。control-で始まるクラスの項目で Tab を押すと、次の項目へ移ります。Markdown の項目に来たときはエディタに切り替えてフォーカスし、非表示の項目や読み取り専用の表示(control-text・control-markup)は飛ばします。
キーの変更・追加
標準の機能やパラメータで accesskey を変える方法はありません。
サーバースクリプトでボタンを消す・無効にする
サーバースクリプトの elements.DisplayType(ボタンの ID, 値) で、ボタンの出し方を変えられます(ServerScriptElements.cs、HtmlCommands.cs#L622-L677)。
| 値 | 名前 | 動作 |
|---|---|---|
| 0 | Displayed | 通常どおり |
| 1 | None | ボタンを出力しない(ショートカットキーも無くなる) |
| 2 | Disabled | disabled で出力する |
| 3 | Hidden | style="display:none;" で出力する |
elements.DisplayType('DeleteCommand', 1); // 削除ボタンを出さない
elements.LabelText('UpdateCommand', '保存して閉じる'); // ラベルを変える対象にできるのは CreateCommand・UpdateCommand・DeleteCommand・OpenCopyDialogCommand・ReferenceCopyCommand・MoveTargetsCommand・EditOutgoingMail・BulkDeleteCommand・BulkMoveTargetsCommand・EditImportSettings・OpenExportSelectorDialogCommand・OpenBulkUpdateSelectorDialogCommand・EditOnGridCommand・UpdateByGridCommand など、HtmlCommands.cs がサーバースクリプトの設定を見て出すボタンです。「戻る」(GoBack)は LabelText でラベルだけ変えられ、DisplayType は効きません。
スクリプトでキーを変える・足す
accesskey は属性なので、スクリプトで書き換えればすぐに効きます。イベントを登録し直す必要はありません。
$('#UpdateCommand').attr('accesskey', 'u'); // 更新を u に変える
$('#DeleteCommand').removeAttr('accesskey'); // 削除のショートカットキーを外す
$('#Reload').attr('accesskey', 'e'); // 再読み込みに e を割り当てる既存のボタンと同じキーを新しいボタンに付けるときは、先に既存のボタンの accesskey を外します。同じキーが 2 つあると、どちらが押されるかはブラウザによって違います。
Ctrl + Enter のような accesskey で表せない組み合わせは、keydown イベントで作ります。
$(document).on('keydown', function (e) {
// Ctrl + Enter で更新
if (e.ctrlKey && e.key === 'Enter') {
e.preventDefault();
$('#UpdateCommand').click();
}
// ダイアログが開いていないときの Esc で戻る
if (e.key === 'Escape' && !$('.ui-dialog:visible').length) {
e.preventDefault();
$p.back();
}
});