タグ

2021年1月27日のブックマーク (3件)

  • 複合検索(絞り込み検索)をPHPとJavaScriptで実装(後編)

    複合検索(絞り込み検索)の実装後編ではループ表示とページング機能を作るとともに、JavaScriptとAjax(jQuery)を使用してより使いやすい複合検索(絞り込み検索)フォームにしてみたいと思います。ワードプレスではAjax用のリクエストルートも用意されていますので確認していきます。 2019年3月5日 検索結果のループ表示と固定ページでのページング 検索結果を標準ループで表示 前回『複合検索(絞り込み検索)をPHPJavaScriptで実装(前編)』までの内容でWP_Queryに与える引数$argsができましたので、あとはループを回すだけになります。記述は以下のようになります。 <?php $the_query = new WP_Query($args); ?> <ul> <?php if ($the_query->have_posts()) : ?> <?php while (

    複合検索(絞り込み検索)をPHPとJavaScriptで実装(後編)
  • 複合検索(絞り込み検索)をPHPとJavaScriptで実装(前編)

    複合検索(絞り込み検索)と言いますと「エリアで探す」「間取りで探す」「家賃で探す」などの不動産物件情報サイトが思い浮かびます。もちろんワードプレスでもこうした機能は可能です。基的な機能だけならPHPだけで可能ですがJavaScriptも併用すればより使いやすい検索機能になります。 2019年3月7日 複合検索(絞り込み検索)の完成イメージ Indeed(インディード)やGoogle for Jobsのような無料の求人サービスが出てきたことで、自社ホームページ内に求人情報を掲載する企業が増えてきています。特に恒常的に人材不足である飲業などは、そうしたサービスを活用することで採用コストがある程度下げられると考えられています。 こうした背景もあって、ワードプレスでホームページを作りつつそのなかに求人コンテンツを作成するわけですが(ホームページ全体をワードプレスで作り直すか、既にワードプレスで

    複合検索(絞り込み検索)をPHPとJavaScriptで実装(前編)
  • jQueryでリスト表示を絞り込む処理を実装する | Tips Note by TAM

    リスト表示をJavaScriptで絞り込んで表示させる機会がたまにあるので、実装方法を3パターン試してみました。 ■目次 選択した項目で絞り込み検索をする 複数の項目で絞り込み検索をする 配列を使ってリスト側に複数の値を設定できるようにする 1. 選択した項目で絞り込み検索をする 以下のデモの様に、リスト表示の上部に絞り込み検索の項目を配置して、その項目をクリックすると絞り込み検索が行われるパターンです。 デモはサッカーW杯の出場国をグループステージの組み合わせで絞り込む実装です。 See the Pen gvMZGM by tam_yi (@tam_yi) on CodePen. 設定方法ですが、絞り込み検索部分、リスト表示部分の両方にdata属性(data-groupという名前にしています)を設定して、値が一致するものを絞り込むようにしています。 例えばグループAを選択した場合、dat

    jQueryでリスト表示を絞り込む処理を実装する | Tips Note by TAM