メニューを切り替える
個人設定メニューを切り替える
個人メニューを切り替える
ログインしていません
編集を行うと、IPアドレスが公開されます。

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

提供: 川西図鑑
編集の要約なし
タグ: 差し戻し済み
0rr2f3 (トーク) による版 191 を取り消し
タグ: 取り消し 差し戻し済み
1行目: 1行目:
== 店舗検索 ==
<!-- 検索ボックス -->
<!-- 検索ボックス -->
<html>
<html>
<form id="store-search-form">
<form method="get" action="">
   <input type="text" id="store-search-input" placeholder="店名・住所・ジャンルで検索" style="width:300px;" />
   <input type="text" name="検索" placeholder="店名・住所・ジャンルで検索" style="width:300px;" />
   <input type="submit" value="検索" />
   <input type="submit" value="検索" />
</form>
</form>
 
</html>
<div id="search-results">
{{#urlget:検索}}
  <!-- 検索結果がここに表示される -->
<!-- 検索実行 -->
</div>
{{#if: {{#urlget:検索}}}
 
   | {{#cargo_query:
<script>
      tables=店舗情報
document.addEventListener('DOMContentLoaded', () => {
      |fields=店舗情報.店名,店舗情報.画像,店舗情報.ジャンル,店舗情報.住所,店舗情報.営業時間,店舗情報.定休日
  const form = document.getElementById('store-search-form');
      |where=(
  const input = document.getElementById('store-search-input');
          店舗情報.店名 LIKE CONCAT('%','{{#urlget:検索}}','%')
  const resultsDiv = document.getElementById('search-results');
          OR 店舗情報.住所 LIKE CONCAT('%','{{#urlget:検索}}','%')
 
          OR 店舗情報.ジャンル LIKE CONCAT('%','{{#urlget:検索}}','%')
  // URLパラメータに?検索=xxxがあればフォームにセット
      )
  const urlParams = new URLSearchParams(window.location.search);
      |format=template
  const searchVal = urlParams.get('検索');
      |template=検索結果カード
  if(searchVal) {
      |named args=yes
    input.value = decodeURIComponent(searchVal);
      |default=該当する店舗はありません。
    performSearch(input.value);
    }}
  }
 
  // フォーム送信時
  form.addEventListener('submit', (e) => {
    e.preventDefault();
    const query = input.value.trim();
    // URLを書き換える(ページ遷移させずブックマーク可能)
    const newUrl = window.location.pathname + '?検索=' + encodeURIComponent(query);
    window.history.replaceState({}, '', newUrl);
 
    performSearch(query);
  });
 
   // 検索実行
  function performSearch(query) {
    let cargoQuery = `
{{#cargo_query:
tables=店舗情報
|fields=店名,住所,ジャンル,画像,営業時間,定休日
|where=(店名 LIKE '%${query}%' OR 住所 LIKE '%${query}%' OR ジャンル LIKE '%${query}%')
|format=template
|template=検索結果カード
|named args=yes
|default=該当する店舗はありません。
}}
}}
`;
    resultsDiv.innerHTML = cargoQuery;
  }
});
</script>
</html>

2025年10月27日 (月) 11:26時点における版

店舗検索

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