I want to filter the search table.
First of all the collection comes from the search controller.
SearchController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\project;
class SearchController extends Controller
{
public function index(Request $request)
{
$search_type = $request->input('search_type');
$search_word = $request->input('search');
$search_result = \DB::table('projects')
->join('project_payments', 'projects.id', '=', 'project_payments.project_id')
->leftJoin('fixed_budgets', 'project_payments.fixed_budget_id', '=', 'fixed_budgets.id')
->leftJoin('hourly_budgets', 'project_payments.hourly_budget_id', '=', 'hourly_budgets.id')
->leftJoin('custom_quotes', 'project_payments.custom_quote_id', '=', 'custom_quotes.id')
->select(
'projects.name', 'projects.description', 'projects.create_time',
'fixed_budgets.project_type as fbproject', 'fixed_budgets.minimum_rank as fbmin', 'fixed_budgets.maximum_rank as fbmax',
'hourly_budgets.rate as hbrate', 'hourly_budgets.minimum_rank as hbmin', 'hourly_budgets.maximum_rank as hbmax',
'custom_quotes.id as quote', 'custom_quotes.minimum_rank as qmin', 'custom_quotes.maximum_rank as qmax'
)
->orderBy('projects.create_time', 'desc')
->limit(6000)
->get();
}
if (empty($search_result)) {
$search_result = "0";
}
return view('search/index', ['search_results'=> $search_result]);
}
}
index.blade.php
@extends('layouts.app')
@section('content')
<livewire:styles>
<livewire:search.search-project-datatable :search="$search_results">
<livewire:scripts>
@endsection
LiveWire Component Controller:
<?php
namespace App\Http\Livewire\Search;
use Livewire\Component;
class SearchProjectDatatable extends Component
{
public $search_results = array();
public function mount($search)
{
$this->search_results = $search->toArray();
}
public function render()
{
return view('livewire.search.search-project-datatable');
}
public function filter()
{
$searchFilter = \DB::table('projects')
->join('project_payments', 'projects.id', '=', 'project_payments.project_id')
->leftJoin('fixed_budgets', 'project_payments.fixed_budget_id', '=', 'fixed_budgets.id')
->leftJoin('hourly_budgets', 'project_payments.hourly_budget_id', '=', 'hourly_budgets.id')
->leftJoin('custom_quotes', 'project_payments.custom_quote_id', '=', 'custom_quotes.id')
->where('projects.name', 'like', '%%')
->orWhere('projects.description', 'like', '%%')
->select(
'projects.name', 'projects.description', 'projects.create_time',
'fixed_budgets.project_type', 'fixed_budgets.minimum_rank', 'fixed_budgets.maximum_rank',
'hourly_budgets.rate', 'hourly_budgets.minimum_rank', 'hourly_budgets.maximum_rank',
'custom_quotes.id', 'custom_quotes.minimum_rank', 'custom_quotes.maximum_rank'
)
->orderBy('projects.create_time', 'desc')
->limit(6000)
->get();
$searchFilter = $searchFilter->toArray();
}
}
search-project-datatable.blade.php
@foreach($search_results as $search_result)
<div class="card-body" style="border-bottom: 1px solid #DDD;">
<div class="card-body d-flex justify-content-between">
<div>
<div class="d-flex">
<h6 class="mr-2">{{ $search_result->name }}</h6>
<p class="small">{{ $search_result->create_time }}</p>
</div>
<div>
<p class="card-text">{{ $search_result->description }}</p>
</div>
</div>
<div>
@isset($search_result->fbproject)
<p class="small">${{ $search_result->fbmin }} - ${{ $search_result->fbmax }}</p>
@endisset
@isset($search_result->hbrate)
<p class="small">${{ $search_result->hbmin }} - ${{ $search_result->hbmax }}</p>
@endisset
@isset($search_result->quote)
<p class="small">${{ $search_result->qmin }} - ${{ $search_result->qmax }}</p>
@endisset
<p>{{ __('Aplicar') }}</p>
</div>
</div>
</div>
@endforeach
When I want to use the page filters it doesn't work, I check the browser console (Mozilla) and it gives me a javascript error. I do not know what I'm doing wrong.
search-project-datatable.blade.php
Html Filters:
<div class="card-body" style="border-bottom: 1px solid #DDD">
<h5 class="card-title">{{ __('Tipo de subasta') }}</h5>
<p class="card-text small"><input type="checkbox" wire:click="filter"> {{ __('Proyectos Precio Fijo') }}</p>
<button wire:click="filter">Like Post</button>
Console Error:
Uncaught (in promise) SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
sendMessage http.js:32
promise callbacksendMessage/< http.js:27
promise callbacksendMessage http.js:25
value index.js:41
value index.js:130
later debounce.js:50
setTimeout handlerdebounce/< debounce.js:54
value index.js:116
debouncedHandler node_initializer.js:179
value index.js:421
debouncedHandler node_initializer.js:141
value dom_element.js:183
attachListener node_initializer.js:193
attachDomListener node_initializer.js:112
initialize node_initializer.js:25
initialize node_initializer.js:9
value index.js:71
value index.js:369
walk walk.js:5
walk walk.js:10
walk walk.js:10
walk walk.js:10
walk walk.js:10
walk walk.js:10
value index.js:356
value index.js:69
Component index.js:40
value index.js:73
value index.js:71
index:270
EventListener.handleEvent index:269