Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.29k stars 531 forks source link

DataGridColumn Filter issue #624

Closed vmakharashvili closed 4 years ago

vmakharashvili commented 4 years ago

Describe the bug Every time I use this: <DataGridColumn Filterable="true"> I get errors in the browser console, which looks like this:

blazor.webassembly.js:1 WASM: Unhandled exception rendering component: blazor.webassembly.js:1 WASM: Microsoft.JSInterop.JSException: element.addEventListener is not a function blazor.webassembly.js:1 WASM: TypeError: element.addEventListener is not a function

However, the filter function actually works. I think it's a bug but maybe I don't use it properly.

Also, Maybe the DataGrid Columns needs to add server-side filtering.

stsrki commented 4 years ago

Not sure why it would give you an error. Filterable property is by default set to true. How do you handle your data? Do you read it from memory all at once, or do you load it dynamically on ReadData event?

vmakharashvili commented 4 years ago

I read it from memory all at once.

<DataGrid TItem="Account"
                  Data="@_accounts"
                  @bind-SelectedRow="@_selectedAccount"
                  ShowPager="false"
                  Filterable="true"
                  RowDoubleClicked="(e => OnAccountClick(e.Item as Account))" Narrow="true">

            <DataGridColumn TItem="Account" Field="@nameof(Account.AccountNumber)" Caption="IBan" Sortable="true" Filterable="true">
            </DataGridColumn>
            <DataGridColumn TItem="Account" Field="@nameof(Account.Ccy)" Caption="Currency" Sortable="true" Filterable="true" /></DataGrid>

This is how I do it.

vmakharashvili commented 4 years ago

In this case I have small data.

stsrki commented 4 years ago

Maybe one of your fields is a complex type. For example is Ccy in Account.Ccy a string or is it a class or struct type? In case it is a complex type, then you need to define full "path". eg Account.Ccy.Name.

vmakharashvili commented 4 years ago

No. I commented out all the other columns and left just this AccountNumber column and still have the same errors in console.

stsrki commented 4 years ago

Can you please provide me with the small repro project so I can have a better look?

vmakharashvili commented 4 years ago

Thanks for the help.

I played a little bit and found that I hadn't set up Blazor properly.