Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Simple Laravel Backpack text filter for a single field
<?php /** app/Http/Controllers/CrudController.php **/
namespace App\Http\Controllers;
use Illuminate\Http\Response;
class CrudController extends \Backpack\CRUD\app\Http\Controllers\CrudController
{
public function setUp()
{
// ...
$this->crud->addFilter(
[
'type' => 'text',
'name' => 'username',
'label'=> 'Username'
],
null,
function ($value) {
$this->crud->addClause('where', 'username', 'LIKE', "%$value%");
}
);
// ...
}
}
<!-- resources/views/vendor/backpack/crud/filters/text.blade.php -->
<li filter-name="{{ $filter->name }}"
filter-type="{{ $filter->type }}"
class=" {{ Request::get($filter->name)?'active':'' }}">
<span style="display: inline-block;">{{ $filter->label }}</span>
<input type="text" name="{{ $filter->name }}" style="width: 150px;" />
</li>
@push('crud_list_scripts')
<script>
jQuery(document).ready(function($) {
$("input[name={{ $filter->name }}]").keyup(debounce(function(e) {
e.preventDefault();
var value = $(this).val();
var parameter = '{{ $filter->name }}';
@if (!$crud->ajaxTable())
// behaviour for normal table
var current_url = normalizeAmpersand("{{ Request::fullUrl() }}");
var new_url = addOrUpdateUriParameter(current_url, parameter, value);
// refresh the page to the new_url
new_url = normalizeAmpersand(new_url.toString());
window.location.href = new_url.toString();
@else
// behaviour for ajax table
var ajax_table = $("#crudTable").DataTable();
var current_url = ajax_table.ajax.url();
var new_url = addOrUpdateUriParameter(current_url, parameter, value);
console.log(current_url, new_url);
// replace the datatables ajax url with new_url and reload it
new_url = normalizeAmpersand(new_url.toString());
ajax_table.ajax.url(new_url).load();
// mark this filter as active in the navbar-filters
if (URI(new_url).hasQuery('{{ $filter->name }}', true)) {
$("li[filter-name={{ $filter->name }}]").removeClass('active').addClass('active');
}
else
{
$("li[filter-name={{ $filter->name }}]").trigger("filter:clear");
}
@endif
}));
// clear filter event (used here and by the Remove all filters button)
$("li[filter-name={{ $filter->name }}]").on('filter:clear', function(e) {
$("li[filter-name={{ $filter->name }}]").removeClass('active');
$("input[name={{ $filter->name }}]").val('');
});
});
</script>
@endpush
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment