実現したいこと
管理画面の上部にある検索機能で、名前とメールアドレス・性別・お問合せの種類・日付でキーワード検索してその結果を一覧で表示させたい。
(例:性別を女性で検索→性別が女性のみで一覧表示。木嶋で検索→名前で木嶋がある行のみ表示)
スクリーンショット 2024-07-24 20.10.32
スクリーンショット 2024-07-24 20.11.29
発生している問題・分からないこと
以下のコードを元に検索を実行したのですが、ボタンのアクションはあるものの検索結果が変わらないままです。どこかおかしい部分があれば教えていただけたら助かります。
該当のソースコード
livewire
1<div> 2 <form class="form" wire:submit="save"> 3 <input class="search__text" type="search" wire:model="keyword" placeholder="名前やメールアドレスを入力してください" value="{{ old('keyword') }}" /> 4 <span class="search__gender"> 5 <select class="select__gender" wire:model="gender"> 6 <option value="">性別</option> 7 <option value="">全て</option> 8 <option value="男性">男性</option> 9 <option value="女性">女性</option> 10 <option value="その他">その他</option> 11 </select> 12 </span> 13 <span class="search__category"> 14 <select class="select__category" wire:model="category_id"> 15 <option value="">お問い合わせの種類</option> 16 @foreach($categories as $category) 17 <option value="{{ $category['content'] }}"> 18 {{ $category['content'] }} 19 </option> 20 @endforeach 21 </select> 22 </span> 23 <input class="search__date" type="date" wire:model="created_at" /> 24 <button class="search__button" type="submit">検索</button> 25 <input class="reset__button" type="reset" value="リセット" /> 26 </form> 27 <div class="buttons"> 28 <div class="export-btn"> 29 <button class="export">エクスポート</button> 30 </div> 31 <div class="paginate"> 32 @if($results) 33 {{ $searches->links() }} 34 @else 35 {{ $contacts->links() }} 36 @endif 37 </div> 38 </div> 39 <div class="contacts"> 40 <table class="contacts__table"> 41 <tr class="table-heading"> 42 <th class="column">お名前</th> 43 <th class="column">性別</th> 44 <th class="column">メールアドレス</th> 45 <th class="column" colspan="2">お問い合わせ種類</th> 46 </tr> 47 @if($results) 48 @foreach($searches as $search) 49 <tr class="table-inner"> 50 <td class="name"> 51 {{ $search['last_name'] }} 52 <span class="space"></span> 53 <span class="first">{{ $search['first_name'] }}</span> 54 </td> 55 <td class="gender"> 56 <input type="hidden" value="{{ $search['gender'] }}" /> 57 <?php 58 if ($search['gender'] == '1') { 59 echo '男性'; 60 } elseif ($search['gender'] == '2') { 61 echo '女性'; 62 } else { 63 echo 'その他'; 64 } 65 ?> 66 </td> 67 <td class="address"> 68 {{ $search['email']}} 69 </td> 70 <td class="category"> 71 {{ $search['category']['content']}} 72 </td> 73 <td class="detail-button"> 74 <button wire:click="openModal({{ $search['id'] }})" type="button" class="detail">詳細</button> 75 </td> 76 </tr> 77 @endforeach 78 @else 79 @foreach($contacts as $contact) 80 <tr class="table-inner"> 81 <td class="name"> 82 {{ $contact['last_name'] }} 83 <span class="space"></span> 84 <span class="first">{{ $contact['first_name'] }}</span> 85 </td> 86 <td class="gender"> 87 <input type="hidden" value="{{ $contact['gender'] }}" /> 88 <?php 89 if ($contact['gender'] == '1') { 90 echo '男性'; 91 } elseif ($contact['gender'] == '2') { 92 echo '女性'; 93 } else { 94 echo 'その他'; 95 } 96 ?> 97 </td> 98 <td class="address"> 99 {{ $contact['email']}} 100 </td> 101 <td class="category"> 102 {{ $contact['category']['content']}} 103 </td> 104 <td class="detail-button"> 105 <button wire:click="openModal({{ $contact['id'] }})" type="button" class="detail">詳細</button> 106 </td> 107 </tr> 108 @endforeach 109 @endif 110 </table> 111 112 113 114
livewire
1<?php 2 3namespace App\Http\Livewire; 4 5use Livewire\Component; 6use App\Models\Contact; 7use App\Models\Category; 8use Illuminate\Http\Request; 9use Livewire\WithPagination; 10 11class Modal extends Component 12{ 13 use WithPagination; 14 15 public $showModal = false; 16 17 public $result = []; 18 public $results; 19 20 protected $paginationTheme = 'bootstrap'; 21 22 protected $contacts; 23 protected $searches; 24 25 public $keyword = ''; 26 public $gender = ''; 27 public $category_id = ''; 28 public $created_at = ''; 29 30 public function save() 31 { 32 $this->result= Contact::where(function($query){ 33 $query->where('last_name', '=', $this->keyword)->orWhere('first_name', '=', $this->keyword)->orWhere('email','=',$this->keyword)->orWhere('last_name','like','%'.$this->keyword.'%')->orWhere('first_name', 'like', '%' . $this->keyword . '%')->orWhere('email', 'like', '%' . $this->keyword . '%')->orWhere('gender', $this->gender)->orWhere('category_id', $this->category_id)->orWhere('created_at', $this->created_at); 34 })->get(); 35 36 $this->results = true; 37 38 } 39 40 public function render() 41 { 42 $categories = Category::all(); 43 44 if(!$this->results == true){ 45 $contacts = Contact::with('category')->paginate(7); 46 return view('livewire.modal', compact('categories', 'contacts')); 47 }else{ 48 $searches = Contact::with('category')->paginate(7); 49 return view('livewire.modal', compact('categories', 'searches')); 50 } 51 } 52
試したこと・調べたこと
- teratailやGoogle等で検索した
- ソースコードを自分なりに変更した
- 知人に聞いた
- その他
上記の詳細・結果
laravelのlivewire formとwire:submit="save" のマニュアルがあったのでそれを参考にしましたが、上記の質問の通り上手くいかず検索機能が実行できていない状態です。
https://livewire.laravel.com/docs/forms
補足
特になし
![guest](/img/icon/icnUserSample.jpg)
あなたの回答
tips
プレビュー