Search button disappearing V1.5

This issue has been tracked since 2021-10-13.

If I'm programmatically removing, then adding columns in grid (simulating a pivot table feature), the search button is disappearing, even if I'm declaring explicitly toolbarSearch: true and defining (programmatically) the searches list.
Why???

mpf82 wrote this answer on 2021-10-13

Can you please provide a fiddle that demonstrates the issue?

boumboum wrote this answer on 2021-10-14

Sure. https://jsfiddle.net/nrbuoghk/
But this is just the client side, as I'm generating the columns dynamically on the server side

And here is the server side code:

@app.get('/api/gettasks')
async def gettasks():
    try:
        async with aiosqlite.connect('data.db') as db:
            rows = []
            sum_tasks = []
            columns = [
                { 'field': 'report_date', 'text': 'Nap', 'size': '100px', 'sortable': True, 'resizable': True, 'searchable': True },
                { 'field': 'name', 'text': 'Művezető', 'size': '120px', 'sortable': True, 'resizable': True, 'searchable': True },
                { 'field': 'pt_part', 'text': 'Fázis', 'size': '330px', 'sortable': True, 'resizable': True, 'searchable': True },
                { 'field': 'wr_run', 'text': 'Terv. idő', 'size': '70px', 'sortable': True, 'resizable': True, 'searchable': True, 'render': 'float:2' }
            ]
            
            recid = 0

            async with db.execute(SQL_TASK) as cr:
                cols = {}
                async for row in cr:
                    if row[3] in cols:
                        cols[row[3]] = cols[row[3]] + row[5]
                    else:
                        cols[row[3]] = row[5]
                    rows.append(jsonable_encoder({'recid': recid, 'report_date': row[0], 'login': row[1], 'name': row[2], 'pt_part': row[4], 'wr_run': row[6], row[3]: row[5]}))
                    recid += 1
                                
                for k, v in cols.items():
                    columns.append({'field': k, 'text': k, 'size': '85px'})

                cols['recid'] = 'S-1'
                sum_tasks.append(jsonable_encoder(cols))
                
                return {'status': 'OK', 'columns': columns, 'rows': rows, 'sum_tasks': sum_tasks}
    except Exception as e:
        print(e)
        return {'status': 'Error', 'errmsg': e}

mpf82 wrote this answer on 2021-10-14

I updated your fiddle so that it actually diaply something: http://jsfiddle.net/vykfnwcb/

There are no searches defined on your grid, thus there's no search button.

Docs: http://w2ui.com/web/docs/2.0/w2grid.searches

Demo: http://w2ui.com/web/demos/#/grid/3

Demo with w2ui 1.5 files: http://jsfiddle.net/mLy8qe61/

Demo with w2ui 1.5 without searches: http://jsfiddle.net/mLy8qe61/1/

boumboum wrote this answer on 2021-10-15

Well Initially I've got searches defined, but I've removed it because it gave me no effect.
In fact even in your fiddle there is no search button even tough I've explicitly added toolbarSearch : true, in the grid definition and I have a redundant w2ui.tasks.refresh(); in the loadTasks function just to make the grid "aware" of the existence of data.

For me it's still a bug as the search button is visible if I'm defining the grid at the design phase (even with no explicit searches defined as it than takes all fields with searchable: true option by default) and no search button if I create/modify the structure on the fly.

So the question is: How to let the toolbarSearch button appearing?

mpf82 wrote this answer on 2021-10-15

Just so we're talking about the same thing ... you mean this search button, correct?

grafik

The codition for this search button to be added to the grid is as follows:

            if (this.show.toolbarSearch && this.multiSearch && this.searches.length > 0) {
                this.toolbar.items.push($.extend(true, {}, this.buttons['search-go']));
            }

So you need all three: grid.show.toolbarSearch + grid.multiSearch + grid.searches

Now, you seem to expect that having your column.searchable set to true automatically makes theam appear in the advaced search - and your expectation is actually semi-valid.

If the columns are defined when the grid is created, each searchable column is passed to grid.addSearch() and therefore is added to grid.searches.

Also, each searchable column that is added to the grid with grid.addColumn() is passed to grid.addSearch() and therefore is added to grid.searches.

However, you are replacing the column array, so there's mechanism that checks if the columns are searchable during refresh.

Same goes for records: records added with grid.add() are passing some checks, while replacing grid.records with a new array may lead to inconsistent behavior (e.g. if the new records.length does not match grid.total)

mpf82 wrote this answer on 2021-10-15

Ok, so the mentioned check is only done once in grid.initToolbar

You'd have to add the button manually to the toolbar.

Working fiddle: http://jsfiddle.net/mbwhyjrg/

I'll assign @vitmalina so he can decide if this should be considered a bug.

vitmalina wrote this answer on 2021-10-20

I agree with @mpf82, the button will only appear if there are searchable columns when grid is created. Hence, closing the issue.

More Details About Repo
Owner Name vitmalina
Repo Name w2ui
Full Name vitmalina/w2ui
Language JavaScript
Created Date 2011-04-12
Updated Date 2022-06-22
Star Count 2000
Watcher Count 179
Fork Count 665
Issue Count 255

YOU MAY BE INTERESTED

Issue Title Created Date Updated Date