お世話になっております。
この度YES、NOチャートをWordPressにて実装してみることにしました。
世間で良く出回っている「YESだったら問5に飛ぶ、NOだったら問7に飛ぶ」などといったアンカー式のチャートとは違い、
全問に答えた後、設問に対するYES&NOので結果を出力する複雑なチャートになります。
前提・実現したいこと
設問ページ
php
Q1 果物は好き? Q2 野菜は好き? Q3 温泉は好き? ↓ ・Q1(YES) Q2(YES) Q3(YES) → 結果:赤色 ・Q1(YES) Q2(YES) Q3(NO) → 結果:黄色 ・Q1(YES) Q2(NO) Q3(NO) → 結果:緑色 ・Q1(NO) Q2(NO) Q3(NO) → 結果:青色 ・Q1(NO) Q2(YES) Q3(YES) → 結果:紫色 ・Q1(YES) Q2(NO) Q3(YES) → 結果:白色
上記の形が理想のチャートになります。
すべて<form><input type="radio">~中略
でYES&NOの回答をするのですが、
結果ページにてその際の分岐がどうしても下記の様に蛇足気味になってしまいます…
該当のソースコード
設問ページ
php
<form method="get" action="<?php echo home_url('/result'); ?>"> <ul> <li> <div class="diagnose_ttl"><span>Q1</span> 果物は好き?</div> <div class="flex diagnose_select"> <div><input type="radio" id="yes" data-err-txt="項目が選択されていません" required name="diagnose_1" value="yes"><label>YES</label></div> <div><input type="radio" id="no" data-err-txt="項目が選択されていません" name="diagnose_1" value="no"><label>NO</label></div> </div> </li> <li> <div class="diagnose_ttl"><span>Q2</span> 野菜は好き?</div> <div class="flex diagnose_select"> <div><input type="radio" id="yes" data-err-txt="項目が選択されていません" required name="diagnose_2" value="yes"><label>YES</label></div> <div><input type="radio" id="no" data-err-txt="項目が選択されていません" name="diagnose_2" value="no"><label>NO</label></div> </div> </li> <li> <div class="diagnose_ttl"><span>Q3</span> 温泉は好き?</div> <div class="flex diagnose_select"> <div><input type="radio" id="yes" data-err-txt="項目が選択されていません" required name="diagnose_3" value="yes"><label>YES</label></div> <div><input type="radio" id="no" data-err-txt="項目が選択されていません" name="diagnose_3" value="no"><label>NO</label></div> </div> </li> </ul> <input type="submit" value="結果" /> </form>
診断結果ページ
php
<?php $Q1 = $_GET['diagnose_1']; $Q2 = $_GET['diagnose_2']; $Q3 = $_GET['diagnose_3']; if ($Q1 === 'yes' && $Q2 === 'no' && $Q3 === 'no') { echo 'Q1だけyes'; } elseif ($Q1 === 'yes' && $Q2 === 'yes' && $Q3 === 'no') { echo 'Q1とQ2だけyes'; } elseif ($Q1 === 'yes' && $Q2 === 'yes' && $Q3 === 'yes') { echo '全てyes'; } elseif ($Q1 === 'no' && $Q2 === 'no' && $Q3 === 'no') { echo 'no'; } elseif ($Q1 === 'no' && $Q2 === 'yes' && $Q3 === 'yes') { echo 'Q1だけno'; } elseif ($Q1 === 'yes' && $Q2 === 'no' && $Q3 === 'yes') { echo 'Q2だけno'; } ?>
上記のように設問が多くなれば多くなるほどif文での書き込みが必要になり、
現在500以上のif文を書かなければいけない状態(汗)になっております。
質問事項
そこで皆様に質問がございます。
このようなチャートに対して蛇足にならない、メンテナンス性が良い書き方などありましたらご教示頂きたく存じます。
何卒宜しくお願い致します。
まだ回答がついていません
会員登録して回答してみよう