料理コーナー　料理検索機能追加　ソースと解説

前回のつづきとして今回は料理を検索する機能を作ってみました。

丼、肉、野菜などの単語を入力して検索することができます。

このように、ブラウザ左側の枠に文字を入力できる窓を開けています。ここに単語を入力して、下の料理を検索というボタンを押して検索するという方式です。

前回の生徒名検索では登録されている生徒名で検索するのですから、検索結果がゼロという事はありませんが、今回は任意に文字列で検索するので、見つからない場合が出てきます。このため、ヒット数をカウントして、ゼロ件だった場合は、見つからなかった旨のメッセージを表示します。

phpソース

実際の文字コードはUTF-8ですが、ここではShift-JISにして表示します。

MVC	file name	概要
Controller	gno_ryori.php	プログラムの本体今回はfunction kensaku_ryori()を追加
Model	gno_ryori_model.php	データベース関連関数の定義今回はfunction get_ryori_search($q)とfunction get_ryori_search($q)を追加
View	gno_ryori_list.php	料理の一覧を表示（変更無し）
	gno_ryori_main.php	料理映像を表示(変更なし)
	gno_ryorisubmenu.php	左側の検索枠（料理検索窓を追加）
	gno_ryori_tmpl.php	Webブラウザに送るhtmlを構成する枠組(変更無し)
	gno_ryori_no_side_tmpl.php	Webブラウザに送るhtmlを構成する枠組(新規作成：映像表示用)
	header.php	AvocadoMix共通ヘッダー(変更なし)
	footer.php	AvocadoMix共通フッター(変更なし)

前回、左に枠を表示するためにレイアウトを変更しましたが、映像表示の画面ではタイトル等が右に寄ってしまう不具合が発生したので、それ専用にgno_ryori_no_side_tmpl.phpというテンプレートを追加しました。これは以前のものとまったく同じものです。

controllers/gno_ryori.php　（関数を1個追加など）

<?php
/*
 * 黒木料理長の料理コーナー　2016年11月28日(月)
 * 2019.08.27　生徒名検索機能追加
 * 2019.09.03　料理検索機能追加
 */

------------- 途中省略 --------------------

# 料理を検索し、結果を表示
	function kensaku_ryori()
	{
		$q       = '';	// 検索キーワード(検索用)
		$q_disp  = '';	// 検索キーワード(表示用)
		$q_uri   = '';	// 検索キーワード(URIセグメント用)

		// 検索キーワードがPOSTされた場合は、qフィールドより取得。
		if ($this->input->post('q'))
		{
			$q = $this->input->post('q');
		}

		// 全角スペースを半角スペースに変換。
		$q = trim(mb_convert_kana($q, "s"));
		// 検索キーワードに「/」が含まれる場合は、3番目のURIセグメントに「/」が
		// 含まれ、URIを適切に表示できなくなるので、その例外処理をする。
		// URIでの半角「/」を全角「／」に置換する。
		if (strpos($q, '/') !== FALSE)
		{
			$q_disp = $q;
			$q_uri  = str_replace('/', '／', $q);
		}
		// 検索キーワードが空の場合は、3番目のURIセグメントも空になってしまい
		// URIを適切に表示できなくなるので、その例外処理をする。
		// キーワードが「-」または空の場合は、検索キーワードのURIセグメントを
		// 「-」とする。
		else if ($q == '-' || $q == '')
		{
			$q      = '';
			$q_disp = '全件';
			$q_uri  = '-';
		}
		else
		{
			$q_disp = $q;
			$q_uri  = $q;
		}
		// モデルから、キーワードで検索した料理データと総件数を取得。
		$data['list'] = $this->Gno_ryori_model->get_ryori_search($q);
		$total = $this->Gno_ryori_model->get_count_ryori_search($q);

		if ($total)
		{
		$data['msg'] = '　['.$q_disp.']で検索し、'.$total . '件がヒットしました。';
		}
		else
		{
		$data['msg'] = '　['.$q_disp.']で検索したところ、見つかりませんでした。';

		}
		$data['seito'] = $this->Gno_ryori_model->get_seito_list();
		$data['main']   = $this->load->view('gno_ryori_list', $data, TRUE);
		$data['submenu']   = $this->load->view('gno_ryori_submenu', $data, TRUE);
		$this->load->view('gno_ryori_tmpl', $data);

	}

}
?>

今回追加したのは、function kensaku_ryori()ですが、これまでいくつかのプログラムで使ったブラウザから入力した文字を使って検索する関数をほとんどそのまま使っています。

views/gno_ryori_model.php　（関数を2個追加）

<?php
Class Gno_ryori_model extends Model
{
	function Gno_ryori_model()
	{
		parent::Model();
		$this->load->database();
	}

------------- 途中省略 --------------------

	//料理検索
	function get_ryori_search($q)
	{
		$keywords = explode(" ", $q);
		foreach ($keywords as $keyword)
		{
			$this->db->like('ryori', $keyword);
		}
		$this->db->order_by('id');
		$query = $this->db->get('gno_ryori');
		return $query->result();
	}

	//料理検索ヒット数
	function get_count_ryori_search($q)
	{
		$keywords = explode(" ", $q);
		foreach ($keywords as $keyword)
		{
			$this->db->like('ryori', $keyword);
		}
		$query = $this->db->get('gno_ryori');
		return $query->num_rows();
	}


}
?>

function get_ryori_search($q)では、検索にヒットした全レコードを返します。

function get_count_ryori_search($q)では、ヒットした件数を返します。これは、検索結果として、見つからなかったというメッセージを表示する為です。

views/gno_ryori_submenu.php

<div id="side_navi">
<h3>料理を検索</h3>
１文字以上の文字列を入力
<ul>
<li><form action="../nengo/index.php/gno_ryori/kensaku_ryori" method="post">
	<input type="text" name="q" value="" style="ime-mode: active"/><br />
	<input type="submit" value="　料理を検索　" />
    </form>
</li>
</ul>
<h3>生徒名で検索</h3>
<ul>
<?php foreach($seito as $row): ?>
<?php $s_url='<a href="../nengo/index.php/gno_ryori/kensaku_seito/' . $row->seito_name . '">';?>
<li><?=$s_url;?><?=$row->seito_name;?></a></li>
<?php endforeach; ?>
</ul>
</div>

検索する文字列をブラウザに入力する窓を開けています。プログラムへの引き渡しはPOST方式です。

実行

下の画像をクリックすると実行されます。

肉、野菜、などの単語を入力して試してください。

検索された一覧から、さらに「視聴」ボタンを押すと動画が再生されます。

2019年9月3日　記

Page Top