I found another bug today: The datagrid filter is not working for date columns if the filter is set to "simple" mode in datagrid properties. In "advanced" mode, everything works as expected.
Can you please take a look at it?
Okay, then maybe it's just a Radzen IDE problem:
I created a small example application:
https://easyupload.io/vtjsd8
As you can see in the example, something popups up left of the screen. I used the browser's DOM editor to move it to the center, but strangely enough, it looks like a dropdown to select months only.
I tried Chrome, Firefox and Edge all with the same result. Is it possible that it has something to do with my culture settings?
What are your culture settings? Are there any JS errors? Does our online demo work? Lastly - you said it opens somewhere in the DOM - can you make a screenshot showing the popup element with its position? Here is how it normally looks (browsing https://blazor.radzen.com/datagrid-loaddata):
My Windows 10 culture and keyboard settings are on "German". No, there are no JS errors on the browser's dev console in my application. The behavior is the same on your online demo "Binding with LoadData event". On your website, there's just an error resulting from my local Pihole-DNS server, which blocks all ads and google analytics stuff, but I think it's unrelated to this error.
I made you a screenshot with the browser dev tools and the inspector centered on the element.
Left, top and width are 0. If I change these values, I can see the month picker, but not the date picker.
The problem is that all CSS attributes are set to 0 for some unknown reason. Unfortunately I can't reproduce it for the life of me even with German settings:
There is a chance it isn not the language that is causing this.
Indeed this is probably also unrelated.
The only thing I can suggest is to try and debug the JS function which positions the popup. It is right here: radzen-blazor/Radzen.Blazor/wwwroot/Radzen.Blazor.js at master · radzenhq/radzen-blazor · GitHub
To debug it you can do the following:
- Get the Radzen.Blazor.js file from github and copy it to your application's wwwroot directory.
- Add the _Host.cshtml file to Radzen's code generation ignore list
- Replace this
<script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>with this<script src="Radzen.Blazor.js"></script>
Now if you run the application it will use the local copy of Radzen.Blazor and you would be able to make modifications to it and debug it.
You can find the file in developer tools and put a breakpoint in the openPopup function to see why all CSS attributes are 0.
Okay, eventually, I got the time to go more into this issue.
I have done as you told:
getBoundingClientRect() returns an object of 0 values.The parent element looks okay, but its parent with class ".rz-overlaypanel" has a display:none attribute. I think, getBoundingRect() returns 0 for all attributes, if the referenced element is invisible.
It think you should set the rz-overlaypanel to visible before getting the bounding client rect.
Hi @Meister_Eder,
Could it be the same problem as Date filter in grid column not loading properly sometimes which we managed to reproduce and will release a fix next week?
If you click the filter icon the popup should display as expected but if you click anywhere else in the grid column the filter appears at the wrong position. Does the filter appear correctly for you if you click the filter icon?
