DataTablesを使用したテーブル生成とサーバーサイド連携(8)

本記事ではDataTablesを使用したテーブル生成方法とサーバーサイド連携方法をシェアします。
前回の記事でページングおよびソート処理の実装が完了しましたので
今回は検索(フィルタリング)処理の作成をおこなっていきたいと思います。

検索(フィルタリング)処理の追加

DataTablesの初期状態では検索ウインドウにワードを入力した時点のタイミングで
都度サーバーサイドと通信がおこなわれるため、検索ボタンはありません。
検索ウインドウに入力されたワードはLaravelからは以下のように取得することが可能です。

//検索ウインドウに入力されたワードを取得
$search_value = $request->search[‘value’];

またサーバーサイドから返却するjsonで設定する合計件数のパラメータは”recordsTotal”と”recordsFiltered”の
いずれもレコードの総件数を設定していましたが、正確には以下のように設定する必要があります。

recordsTotal：レコードの総件数
recordsFiltered：フィルタリング後(検索条件絞り込み後)の総件数

上記の設定を反映させたサーバーサイド側のスクリプトは以下のようになります。

function user_datatables(Request $request) {

    $rec_data = [];
    $query = Member::query();

    //全件件数の取得
    $total_cnt = $query->count();

    //検索処理
    $search_value = $request->search['value'];
    $query->where('mail', 'LIKE', '%'.$search_value.'%')
            ->orWhere('sei', 'LIKE', '%'.$search_value.'%')
            ->orWhere('mei', 'LIKE', '%'.$search_value.'%')
            ->orWhere('sei_kana', 'LIKE', '%'.$search_value.'%')
            ->orWhere('mei_kana', 'LIKE', '%'.$search_value.'%')
            ->orWhere('mail', 'LIKE', '%'.$search_value.'%');

    //検索条件絞り込み後の件数の取得
    $filtered_total_cnt = $query->count();

    $length = $request->length;
    $start = $request->start;
    $order_column = [
                        'id', 
                        'sei', 
                        'sei_kana', 
                        'mail', 
                        'created_at', 
                    ];
    $order_column_num = $request->order[0]['column'];
    $order_dir = $request->order[0]['dir']; // asc or desc
    $query->orderBy($order_column[$order_column_num], $order_dir);
    $query->offset($start);
    $query->limit($length);
    $member_list = $query->get();
    foreach($member_list as $member){
        $row_data = [
            'item1' => $member->id,
            'item2' => $member->sei.$member->mei,
            'item3' => $member->sei_kana.$member->mei_kana,
            'item4' => $member->mail,
            'item5' => $member->created_at->format('Y-m-d H:i'),
        ];
        $rec_data[] = $row_data;
    }

    $draw = $request->draw;
    $res_json = array(
        'draw' => $draw, 
        'recordsTotal' => $total_cnt, 
        'recordsFiltered' => $filtered_total_cnt, 
        'data' => $rec_data, 
    );

    return response()->json($res_json);
}

以上が検索処理の実装サンプルになりますが、実際の運用にはLIKE検索時のエスケープ処理などのセキュリティ対策も必須になります。

次回は上記検索処理の動作確認や、DataTablesを日本語化する方法などを紹介したいと思います。

木曜日担当：nishida