日時フィールドの時間フィールドを非表示にしたい

kintone カスタマイズ
1

 件名について実装方法をご教授ください。

日付フィールドと時刻フィールドを使用すればよいと思われますが、イベントカレンダープラグインを使用するため日時フィールドでなければなりません。

2

takokichi さん

下記のような css で、時間フィールドを非表示にできます。

.input-datetime-cybozu .input-time-cybozu {
display: none !IMPORTANT;
}

.control-datetime-field-gaia {
width: 112px !IMPORTANT;
min-width: 112px !IMPORTANT;
}
3

rex0220さん

 

回答ありがとうございます。

CSSの提案ありがたいのですが、やりたいことは例えばラジオボタンで終日と選択された場合に時間フィールドを隠すということがしたいのです。

となれば、JavaScriptでの実装できるかどうかだと思っております。

4

では、こんな感じで。

jQuery と Moment を使っています。

.value-5347557 は、日時項目に付与された番号です。ブラウザのデベロッパーツールで調べてください。

 

jQuery.noConflict();
(function($) {
"use strict";

var events = [
"app.record.edit.show","app.record.create.show",
"app.record.edit.change.ラジオボタン","app.record.create.change.ラジオボタン"
];
kintone.events.on(events, function(event) {
var record = event.record;
if (record['ラジオボタン'].value === '終日') {
moment.locale('ja');
record['日時'].value = moment(moment(record['日時'].value).format('YYYY-MM-DD')).toISOString();
$('.value-5347557 .input-time-cybozu').hide();
}
else {
$('.value-5347557 .input-time-cybozu').show();
}
return event;
});

kintone.events.on('app.record.detail.show', function(event) {
var record = event.record;
if (record['ラジオボタン'].value === '終日') {
$('.value-5347557 .control-value-content-gaia').each(function() {
$(this).text($(this).text().replace(/0:00/, ''));
});
}
return event;
});

})(jQuery);
5

rex0220さん

早急に回答頂き感謝いたします。

またソースまで丁寧に記載していただき助かりました。

デベロッパーツールで確認できると応用ができるようになりますね。

助言感謝いたします。