Crud: Widgets on lists with filters don't update on filter change

Created on 6 Nov 2019  路  4Comments  路  Source: Laravel-Backpack/CRUD

Bug report

What I did

Set up a CRUD list with filters and a widget displaying info based on the items in the list.

What I expected to happen

Widget info to update when filters are changed.

What happened

The widget doesn't update when filters are changed but the info is correct after a page refresh.

What I've already tried to fix it

??

Backpack, Laravel, PHP, DB version

When I run php artisan backpack:version the output is:

### PHP VERSION:
PHP 7.3.10 (cli) (built: Sep 24 2019 12:36:21) ( NTS )
Copyright (c) 1997-2018 The PHP Group
Zend Engine v3.3.10, Copyright (c) 1998-2018 Zend Technologies

### LARAVEL VERSION:
laravel/framework                     v6.5.0           The Laravel Framework.

### BACKPACK VERSION:
backpack/crud                         4.0.12           Quickly build an admin interfaces using Laravel 6, CoreUI, Boostrap 4 and jQuery.
backpack/generators                   2.0.4            Generate files for laravel projects
backpack/permissionmanager            v4.x-dev 65a7775 Users and permissions management interface for Laravel 5 using Backpack CRUD.
backpack/settings                     v4.x-dev 4891019 Application settings interface for Laravel 5 using Backpack CRUD.
question

Most helpful comment

Hello @oddvalue ,

if i understood correctly you have a Entity Crud and in that Entity Crud List View you have a Widget.

When you filter the Entity Crud List you would like the widget to show the info of the filtered results?

I think that would be a little tricky.

When you filter the list, an ajax call is made that returns the filtered results to display in table.

The only thing that is updated is the table with the filtered results not the view itself. Widget is already on page when the returned data reaches the view after the filter ajax call.

I can see that working (not tested just thinking and writing about it):

Create a custom widget (you can copy the boilerplate from one of the package widgets), the change that you would make is adding unique id's that you could later use to identify the elements.

@if (isset($widget['value']))
      <div class="text-value" id="widgetValue">{!! $widget['value'] !!}</div>
      @endif

Also when defining the widget in the controller make sure you use viewNamespace to point to your new widget.

Listen to draw event of the table:

$('#crudTable').on( 'draw.dt', function(element, dtsettings) {
//get the loaded user in table and updated the widget information
 } 

Maybe there is a better option, but the purpose of widgets in the list view is not to show a specific item info. For that you could use the detailsRow that is something that is shown "per" row.

Hope it helps,
Pedro

All 4 comments

Hi @oddvalue ,

Can I see the code for your widget please? And where you add it to your controller?

Cheers!

Hi @tabacitu ,

The widget is on a list of time logs for multiple users. The list has a filter for the users so ideally I'd like the widget to refresh when the filter is used based on the user id in the request: $this->request->input('user_uuid')

This is my widget code:

            $this->data['widgets']['before_content'] = [
                [
                    'type'        => 'progress_white',
                    'class'       => 'card mb-2',
                    'value'       => $userTime/60,
                    'description' => 'Time logged.',
                    'progress'    => floor($userTime/(6*60)*100),
                    'progressClass' => 'progress-bar bg-primary',
                ],
            ];

This is added in the setupListOperation method in the CRUD controller.

Thanks

Hello @oddvalue ,

if i understood correctly you have a Entity Crud and in that Entity Crud List View you have a Widget.

When you filter the Entity Crud List you would like the widget to show the info of the filtered results?

I think that would be a little tricky.

When you filter the list, an ajax call is made that returns the filtered results to display in table.

The only thing that is updated is the table with the filtered results not the view itself. Widget is already on page when the returned data reaches the view after the filter ajax call.

I can see that working (not tested just thinking and writing about it):

Create a custom widget (you can copy the boilerplate from one of the package widgets), the change that you would make is adding unique id's that you could later use to identify the elements.

@if (isset($widget['value']))
      <div class="text-value" id="widgetValue">{!! $widget['value'] !!}</div>
      @endif

Also when defining the widget in the controller make sure you use viewNamespace to point to your new widget.

Listen to draw event of the table:

$('#crudTable').on( 'draw.dt', function(element, dtsettings) {
//get the loaded user in table and updated the widget information
 } 

Maybe there is a better option, but the purpose of widgets in the list view is not to show a specific item info. For that you could use the detailsRow that is something that is shown "per" row.

Hope it helps,
Pedro

Closing this as i think this is not really an issue.

If you think I am wrong please re-open it and add your toughts. It's not the first time i was wrong. :)

If you have further questions that is not a BUG/FEATURE you can ask them in our gitter channel .

Best,
Pedro

Was this page helpful?
0 / 5 - 0 ratings

Related issues

deepaksp picture deepaksp  路  3Comments

sonoftheweb picture sonoftheweb  路  3Comments

gotrecillo picture gotrecillo  路  3Comments

voidstate picture voidstate  路  3Comments

genesiscz picture genesiscz  路  3Comments