いつも大変お世話になっております。
以下のように、
「回収状況」: 未回収 の場合、「回収予定日」を入力しないとエラーで「必須です」となるようにしております。
普通であれば「回収状況1」「回収予定日1」で、赤の背景に白文字で「必須です」となりますが、
グループの背景色を変えた場合、赤の背景がなくなって、白文字の「必須です」となってしまいますが、
なにか目出すように「必須です」を表示させる方法はありますでしょうか?
ぜひ、ご指導のほどよろしくお願い致します。
(function () {
“use strict”;
// エラーを表示する処理
var events2 = [‘app.record.index.edit.submit’, ‘app.record.create.submit’, ‘app.record.edit.submit’, ‘app.record.edit.show’];
kintone.events.on(events2, function (event) {
var record = event.record;
if (record.回収状況.value === “未回収” && !record.回収予定日.value) {
record.回収予定日.error = “必須です”;
}
if(record.回収状況1.value === “未回収” && !record.回収予定日1.value) {
record.回収予定日1.error = “必須です”;
}
return event;
});
})();
======================================
グループの背景css
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000{
border-color: #572e2e;
background-color: #f3cdcd;
}
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000 * {
background-color: #f3cdcd;
}
柳生 様
こんにちは。
恐らく下記cssで、グループ内すべての要素の背景色を指定している、
つまりエラーメッセージの背景も含めて、グループの背景色に指定しているのが原因かと思います。
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000 * {
background-color: #f3cdcd;
}
そのため、上記部分の指定を削除してグループの背景色のみを指定する、
もしくはエラーメッセージの背景色を本来の色に指定するcssの記述を追加するのはいかがでしょうか。
また、ご存知と思いますがDOM 操作の場合、
今後のアップデートで動作しなくなる可能性があるのでご注意ください。
sio 様
お世話になっております。
お忙しいところ、アドバイス頂き、誠にありがとうございます。
おっしゃる通り、グループ内すべての要素の背景色を指定したからでした。
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000 * {
background-color: #f3cdcd;
}
を削除することで、エラーはいつものように表示されることができました!
ただ、ほかのフィールド名の背景色が変になってしますので、
グループの背景css
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000{
border-color: #572e2e;
background-color: #f3cdcd;
}
.input-error-cybozu {
background-color: #ed2125;
}
.layout-gaia.editablelayout-gaia .control-gaia.control-group-field-gaia.field-0000000 * {
background-color: #f3cdcd;
}
追加でエラーメッセージの背景色を本来の色に指定するcssを書きたいですが、
エラーの赤い背景がなくなって、うまく書けず(
)、再度アドバイス頂けることは可能でしょうか?
柳生 様
お世話になっております。
>追加でエラーメッセージの背景色を本来の色に指定するcssを書きたいですが、
追加で指定する部分は、エラーの赤い背景の指定の優先順位を上げると
表示されると思いますが、試して頂けますでしょうか。
.input-error-cybozu, .input-datetimebase-error-permanent-cybozu {
background-color: #e74c3c !important;
}
sio 様
大変お世話になっております。
お忙しいところ、再度アドバイス頂き、ありがとうございます。
お蔭様で想定の動きができました!
とても勉強になりました(感動!)
このたびは何度もご指導頂き、誠にありがとうございました。
今後ともどうぞよろしくお願い致します。
柳生 様
解決されたようで何よりです!
今後ともどうぞよろしくお願い致します。