MTAppHasCategory
記事・ウェブページの保存時に、必要な数のカテゴリ、または指定した ID のカテゴリが選択されているかをチェックするメソッドです。条件を満たさない場合はエラーダイアログを表示し、保存を中断します。P7 では本体から削除しており、互換コードを掲載しています。
このメソッドは MTAppjQuery P7 には同梱していません(非推奨)。
カテゴリの選択を必須にするだけであれば、PowerCMS 標準の設定で実現できます。管理画面の「設定 → PowerCMS 設定」を開き、「カテゴリ / フォルダ」の 「カテゴリの選択を必須にする」(ウェブページの場合は「フォルダの選択を必須にする」)にチェックを入れてください。JavaScript を書く必要がなく、サーバー側でも検証されます。新しく作る場合はこちらをお使いください。
特定のカテゴリ ID を必須にしたい場合や、エラーダイアログの文言・見せ方を自分で決めたい場合に限り、このページのコードを
user.jsにコピーしてお使いください。
記事・ウェブページの保存時に、必要な数のカテゴリ、または指定した ID のカテゴリが選択されているかをチェックするメソッドです。条件を満たさない場合はエラーダイアログを表示し、保存を中断します。
P5 では本体に同梱していましたが、PowerCMS 7 の標準機能と重複するため P7 では削除しました。すでに user.js で使用中の場合は、下記のコードを user.js に貼り付ければ、呼び出し方・オプション名を変えずにそのまま動作します。
構文
$.MTAppHasCategory(options);静的メソッド($.MTAppHasCategory)です。記事・ウェブページの編集画面でのみ動作します。
パラメータ
options {Object} — 省略可。以下のプロパティを持ちます。
| プロパティ | 型 | 既定値 | 説明 |
|---|---|---|---|
requiredIds | string | '' | 必須にするカテゴリ ID をカンマ区切りで指定(例: '3,5')。ここに挙げた ID がすべて選択されている必要があります |
requiredCount | number | 0 | 選択が必要なカテゴリの数。1 を指定すると「1つ以上の選択」が必須になります |
idErrorTitle | string | 'エラー' | requiredIds を満たさないときのダイアログのタイトル |
idErrorContent | string | '必須カテゴリが選択されていません。' | 同・本文。HTML としてそのまま描画されます |
countErrorTitle | string | 'エラー' | requiredCount を満たさないときのダイアログのタイトル |
countErrorContent | string | '必要な数のカテゴリが選択されていません。' | 同・本文。HTML としてそのまま描画されます |
requiredIds と requiredCount は併用できます。その場合は requiredIds が先に判定されます。
戻り値
なし(undefined)。
保存される値
このメソッドは値を変更しません。条件を満たさない場合に保存(フォームの送信)そのものを中断します。
使用例
// カテゴリを1つ以上選択させる
$.MTAppHasCategory({
requiredCount: 1,
countErrorTitle: 'カテゴリ選択エラー',
countErrorContent: 'カテゴリを選択してください。'
});
// 特定のカテゴリ(ID 3 と 5)を必ず選択させる
$.MTAppHasCategory({
requiredIds: '3,5',
idErrorTitle: 'カテゴリ選択エラー',
idErrorContent: '「お知らせ」と「重要」の両方を選択してください。'
});コード
以下を user.js の先頭(各メソッドの呼び出しより前)に貼り付けてください。
(function ($) {
/**
* 記事・ウェブページの保存時に、必要な数のカテゴリ、または指定した ID のカテゴリが
* 選択されているかをチェックする。満たさない場合はダイアログを表示して保存を中断する。
*
* @param {Object} [options]
* @param {string} [options.requiredIds=''] 必須にするカテゴリ ID をカンマ区切りで指定
* @param {number} [options.requiredCount=0] 選択が必要なカテゴリの数
* @param {string} [options.idErrorTitle] requiredIds を満たさないときのダイアログのタイトル
* @param {string} [options.idErrorContent] 同・本文
* @param {string} [options.countErrorTitle] requiredCount を満たさないときのダイアログのタイトル
* @param {string} [options.countErrorContent] 同・本文
*/
$.MTAppHasCategory = function (options) {
const op = $.extend({}, $.MTAppHasCategory.defaults, options);
const $form = $('form#entry_form');
if ($form.length < 1) {
return;
}
if (mtappVars.type !== 'entry' && mtappVars.type !== 'page') {
return;
}
const requiredIds = op.requiredIds ? op.requiredIds.split(',') : [];
// 中断した保存をやり直せるよう、ダイアログを閉じた時にボタンと mt:once を戻す
const dialogOptions = {
modal: true,
close: function () {
$('div.actions-bar :disabled').prop('disabled', false);
$form.removeAttr('mt:once');
}
};
const showError = (title, content) => {
$.MTAppDialogMsg($.extend({}, dialogOptions, { title: title, content: content }));
};
$form.on('submit.MTAppHasCategory', function () {
const isPreview = $(this).serializeArray().some(
(param) => param.name === '__mode' && param.value === 'preview_entry'
);
if (!isPreview) {
// このまま保存へ進むので、未保存の変更に対する警告は出さない
if (typeof Editor !== 'undefined' && Editor.strings) {
delete Editor.strings.unsavedChanges;
}
$(window).off('beforeunload');
}
const value = $("input[name='category_ids']").val();
const categoryIds = value ? value.split(',') : [];
if (requiredIds.some((id) => !categoryIds.includes(id))) {
showError(op.idErrorTitle, op.idErrorContent);
return false;
}
if (op.requiredCount && op.requiredCount > categoryIds.length) {
showError(op.countErrorTitle, op.countErrorContent);
return false;
}
if (isPreview) {
return true;
}
if (typeof window.indirectObjects !== 'undefined') {
delete window.indirectObjects;
}
$(this).find('button.primary').prop('disabled', true);
return true;
});
};
$.MTAppHasCategory.defaults = {
requiredIds: '',
requiredCount: 0,
idErrorTitle: 'エラー',
idErrorContent: '必須カテゴリが選択されていません。',
countErrorTitle: 'エラー',
countErrorContent: '必要な数のカテゴリが選択されていません。'
};
})(jQuery);補足
- 上記のコードは PowerCMS 7.1 の記事編集画面で動作を確認しています(カテゴリ未選択での保存の中断、ダイアログの表示、閉じた後の保存ボタンの復帰、カテゴリ選択後の保存)。P5 版から変数宣言の書き方を見直していますが、呼び出し方・オプション名・挙動は P5 と同じです。
- エラーダイアログの表示には MTAppDialogMsg を使用します。こちらは P7 でも本体に同梱しているため、追加のコードは不要です。
- プレビュー時はチェックしません。 プレビューは別ウィンドウ・別タブで開く一時的な表示であり、保存ではないためです。
- ダイアログを閉じると、無効化された保存ボタンと
mt:once属性が元に戻ります。カテゴリを選び直して、そのまま保存し直せます。 idErrorContent/countErrorContentは HTML としてそのまま描画されます。外部から受け取った文字列をそのまま渡さないでください。
関連
- MTAppDialogMsg — ダイアログでメッセージを表示。このメソッドが内部で使用します。
- MTAppCategorySwitch — カテゴリ選択に応じてフィールドの表示を切り替える。
- P5 からのアップグレード — P7 で削除したメソッドの一覧と代替手段。