お返事ありがとうございます。
来週末まで、別件の作業で席を外している時間が多く、返信が遅れてしまう事があります。申し訳ございません。
ご質問の回答になります。ご確認よろしくお願いいたします。
- そのような複雑な組み込みをする理由は何でしょうか。
色々と複雑な事情がありサイト自体が内部制作で、私以外の担当職員はコードとは何ぞや？というようなWeb知識0な状態になります。
その為、他の職員でも更新できるようにするには、なるべくテキスト入力だけで修正・更新できるようにするしかなく、カスタムフィールドとカスタム投稿を使用し、ほとんどが「そこにこれを入力すれば表示されるから」状態にしています。
フォームのセレクトフィールドは、お申込み時のイベント日程の選択になり、別の部分でも使用されているイベント登録用のカスタム投稿の記事と同じものになります。
- その組み込みは必要なものでしょうか。外した場合どのような変化がありますか。
その組み込みが無くても、コンタクトフォームの設定を毎回、日程を修正し更新すればよいのですが、それの場合になりますと、私以外は誰も更新できなくなる可能性がでてます。
- 具体的にどのように実装しているのか、実際のコードについて教えてください。
全体的に量が多いので、その部分のコードのみを記載いたします。それでも多いと思いますが……
function.php
// ～～前略
// フォームへの日付取得-trial
function generate_event_trial()
{
$args = array(
'post_type' => 'custompost-event',
'posts_per_page' => -1,
'orderby' => 'meta_value',
'meta_key' => 'evententry_date',
'order' => 'ASC',
'meta_query' => array(
array(
'key' => 'evententry_category',
'value' => 'trial',
'compare' => '='
)
)
);
$query = new WP_Query($args);
$options = '';
$options .= "<option value=''>参加希望日を選択</option>";
if ($query->have_posts()) {
while ($query->have_posts()) {
$query->the_post();
$date = get_post_meta(get_the_ID(), 'evententry_date', true);
$evententry_date_y = date('Y', strtotime($date));
$evententry_date_m = date('m', strtotime($date));
$evententry_date_j = date('j', strtotime($date));
$evententry_date_w = date('w', strtotime($date));
$week_jp = array("日", "月", "火", "水", "木", "金", "土");
$evententry_date_jp = $week_jp[$evententry_date_w];
$formattedDate = "{$evententry_date_y}年{$evententry_date_m}月{$evententry_date_j}日（{$evententry_date_jp}）";
$options .= "<option value='{$date}'>{$formattedDate}</option>";
}
} else {
$options = "<option value='' disabled>ー</option>";
}
wp_reset_postdata();
return $options;
}
// フォームへの日付取得-atten
function generate_event_atten()
{
$args = array(
'post_type' => 'custompost-event',
'posts_per_page' => -1,
'orderby' => 'meta_value',
'meta_key' => 'evententry_date',
'order' => 'ASC',
'meta_query' => array(
array(
'key' => 'evententry_category',
'value' => 'atten',
'compare' => '='
)
)
);
$query = new WP_Query($args);
$options = '';
$options .= "<option value=''>参加希望月を選択</option>";
$uniqueDates = array();
if ($query->have_posts()) {
while ($query->have_posts()) {
$query->the_post();
$date = get_post_meta(get_the_ID(), 'evententry_date', true);
$evententry_date_y = date('Y', strtotime($date));
$evententry_date_m = date('m', strtotime($date));
$formattedDateForValue = "{$evententry_date_y}-{$evententry_date_m}月期";
$formattedDateForDisplay = "{$evententry_date_m}月期";
if (!in_array($formattedDateForValue, $uniqueDates)) {
$options .= "<option value='{$formattedDateForValue}'>{$formattedDateForDisplay}</option>";
$uniqueDates[] = $formattedDateForValue;
}
}
} else {
$options = "<option value='' disabled>ー</option>";
}
wp_reset_postdata();
return $options;
}
// ～～後略
JavaScript
// 動的にドロップダウンを更新「#date-trial」
document.addEventListener("DOMContentLoaded", function () {
const dropdown = document.getElementById("date-trial");
const options = formOptionDataT.options;
if (dropdown) {
dropdown.innerHTML = options;
}
});
// 動的にドロップダウンを更新「#date-atten」
document.addEventListener("DOMContentLoaded", function () {
const dropdown = document.getElementById("date-atten");
const options = formOptionDataA.options;
if (dropdown) {
dropdown.innerHTML = options;
}
});
// ～～後略
コンタクトフォームの設定
<!-- 入力フォーム -->
<div class="section-grid formtype-box">
<label class="grid-c-4-2-6-4 field required">参加希望月</label>
<div class="grid-c-8-4-6-4 formtype-input">
[select* date-atten id:date-atten class:selector-field]
</div>
</div>
<!-- ～～後略 -->
<!-- 確認画面 -->
<div class="section-grid formtype-box">
<label class="grid-c-4-2-6-4 field required">参加希望月</label>
<div class="grid-c-8-4-6-4 formtype-input">
<p>[multiform "date-atten"]</p>
</div>
</div>
<!-- ～～後略 -->
<!-- 入力フォーム -->
<div class="section-grid formtype-box">
<label class="grid-c-4-2-6-4 field required">参加希望日</label>
<div class="grid-c-8-4-6-4 formtype-input">
[select* date-trial id:date-trial class:selector-field]
</div>
</div>
<!-- ～～後略 -->
<!-- 確認画面 -->
<div class="section-grid formtype-box">
<label class="grid-c-4-2-6-4 field required">参加希望日</label>
<div class="grid-c-8-4-6-4 formtype-input">
<p>[multiform "date-trial"]</p>
</div>
</div>
<!-- ～～後略 -->
