How to show ag-grid floating filter in JustPy Python

Question

I want to show the floating filter on all the columns by setting the defaultColDef.floatingFilter to True. But the floating filter is not displayed at all. Another setting of defaultColDef is set correctly such as grid.options.defaultColDef.editable. Can someone point it out what is wrong in the code below? Thanks.

The ag-grid documentation is here.

import justpy as jp
import pandas as pd

import requests
import json

import re
import os
import time

from ratelimit import limits
from tenacity import retry, stop_after_attempt, wait_fixed
from datetime import datetime, timedelta, date

wm_df = pd.read_csv('https://elimintz.github.io/women_majors.csv').round(2)

async def select_all_rows(self, msg):
    await self.grid.run_api('selectAll()', msg.page)

async def deselect_rows(self, msg):
    await self.grid.run_api('deselectAll()', msg.page)

async def resetFilters(self, msg):
    await self.grid.run_api('setFilterModel()', msg.page)

async def restoreFilters(self, msg):
    # savedFilterValues = msg.page.filterValues
    await self.grid.run_api("setFilterModel({year: {type: 'lessThan',filter: '1980'}})", msg.page)

def row_selected(self, msg):
    wp = msg.page
    if msg.selected:
        wp.selected_rows[msg.rowIndex] = msg.data
    else:
        wp.selected_rows.pop(msg.rowIndex)

def downloadRow(self, msg):
    wp = msg.page
    wp.resultSelect.text = wp.selected_rows.values()

def grid_test():
    wp = jp.QuasarPage(dark=False)
    
    wp.selected_rows = {}
    
    grid = wm_df.jp.ag_grid(a=wp)
    grid.options.pagination = True
    grid.options.paginationAutoPageSize = True
    grid.options.columnDefs[0].checkboxSelection = True
    grid.options.columnDefs[0].headerCheckboxSelection = True
    grid.options.columnDefs[0].headerCheckboxSelectionFilteredOnly = True
    grid.options.columnDefs[1].hide = True
    # grid.options.columnDefs[1].floatingFilter = True
    
    # grid.options.defaultColDef.filter = True
    grid.options.defaultColDef.floatingFilter = True
    grid.options.defaultColDef.enableValue = True
    grid.options.defaultColDef.editable = True

    grid.options.rowSelection = 'multiple'
    grid.options.sideBar = True
    grid.on('rowSelected', row_selected)
    
    d = jp.Div(classes='q-pa-md q-gutter-sm', a=wp)
    jp.QButton(label="Download", color="primary", a=d, click=downloadRow)
    buttonResetFilter = jp.QButton(label="Reset filter", color="primary", a=d, click=resetFilters)
    buttonResetFilter.grid = grid
    restoreRestoreFilter = jp.QButton(label="Restore filter", color="primary", a=d, click=restoreFilters)
    restoreRestoreFilter.grid = grid
    wp.resultSelect = jp.Div(classes='q-pa-md q-gutter-sm', a=wp, text='The result will be displayed here')
    
    return wp

jp.justpy(grid_test)

score 0 · Accepted Answer · answered Aug 27 '22 at 19:19

@Kanda - thank you for your excellent question. As a committer of justpy I have added your code to the justpy codebase and tried it out using

python examples/stackoverflow/q73497028.py

The result is:

and i assume you are expecting the behavior described in

https://ag-grid.com/javascript-data-grid/floating-filters/

Given that https://github.com/justpy-org/justpy/issues/314) is not fixed you might want to make sure whether the feature you are expecting is actually available in the justpy version you are using (which you might state in your question for clarity). I am assuming you are using the most current version 0.2.8. Since the revival of justpy as discussed in https://github.com/justpy-org/justpy/discussions/409 you might note that the justpy community tries to stay on top of user expectations. Unfortunately there are limits to fullfilling the expectations so you might want to watch out for questions and issues labeled "ag-grid" in https://github.com/justpy-org/justpy/issues?q=is%3Aopen+is%3Aissue+label%3A%22AG+Grid%22

How to show ag-grid floating filter in JustPy Python

1 Answers1