「飲食店検索」の版間の差分

← 古い編集新しい編集 →

ビジュアルウィキテキスト

2025年12月8日 (月) 18:16時点における版

検索条件

検索結果

エラー: テーブル飲食店情報が見つかりません。

@@ 131行目: / 131行目: @@
 <style>
 .clear-btn {
+  margin-left: auto;
    padding: 8px 16px;
    background: #ccc;
@@ 147行目: / 148行目: @@
      margin-left: auto;
      display: block;
-     width: 100px;
+     width: 75px;
      padding: 14px 0;
      background: #0078ff;
@@ 312行目: / 313行目: @@
 }
 </style>
+<script>
+document.getElementById('searchForm').addEventListener('submit', function (e) {
+  const searchText = document.getElementById('searchText');
+  const genre = document.getElementById('genre');
+  const station = document.getElementById('station');
+  const budget_min = document.getElementById('budget_min');
+  const budget_max = document.getElementById('budget_max');
+  if (searchText.value === '') {
+    searchText.removeAttribute('name'); // 空のとき name属性を削除
+  }
+  if (genre.value === '') {
+    genre.removeAttribute('name'); // 空のとき name属性を削除
+  }
+  if (station.value === '') {
+    station.removeAttribute('name'); // 空のとき name属性を削除
+  }
+  if (budget_min.value === '') {
+    budget_min.removeAttribute('name'); // 空のとき name属性を削除
+  }
+  if (budget_max.value === '') {
+    budget_max.removeAttribute('name'); // 空のとき name属性を削除
+  }
+});
+document.addEventListener('DOMContentLoaded', function () {
+  const params = new URLSearchParams(window.location.search);
+  params.forEach((value, key) => {
+    // input, select, checkbox, radio 全対応
+    const el = document.querySelector(`[name="${key}"]`);
+    if (!el) return;
+    // checkbox / radio (name[] の対応含む)
+    if (el.type === "checkbox" || el.type === "radio") {
+      document.querySelectorAll(`[name="${key}"]`).forEach(input => {
+        if (input.value === value) {
+          input.checked = true;
+        }
+      });
+    } else {
+      // text / select など
+      el.value = value;
+    }
+  });
+  const clearBtn = document.querySelector('.clear-btn');
+  const form     = document.getElementById('searchForm');
+  clearBtn.addEventListener('click', function () {
+    form.reset();
+  });
+});
+</script>
 </html>