Grid flickers and filter dialog hidden in background

[NightWizzardParticipant]

Hello,

so far I’ve created a lot of exciting features with jQWidgets in my MVC5 project but now I got a real problem.
I’ve created a complex view as email system containing a layout that contains an editor and a hidden side bar showing up when panel is clicked and containing a listbox with checkboxes with the receiver mail addresses. There’s also a button opening a window to input a filename for saving the current editor content as html template at server. This all works absolutely fine.

Now I’ve added another button to show a window containg a grid with all database contacts to select receivers from. The grid configuration is exactly the same as in the contacts list view where it also works fine including sorting by several columns, filtering by column tool dialog, grouping etc. I only removed the toolbar to add, edit, delete and export contacts, because this new feature is for selection only. The source (with URL) and DataAdapter is filled and assigned to the grid within the click event procedure of the button and seletion mode is ‘multiplerowsadvanced’ – all the rest is exactly the same as in contact list view where there is no problem with it.

When clicking the new button at runtime, the window appears, grid is loading and here’s the first problem: the loader is shown but behind the window and the user will never see it. After loading the data the grid is showing all the contact rows but when scolling up or down, the grid flickers, rows will disappear for short and appear again when mouse moved over them. Sorting doesn’t work and the filter dialog at each column will open behind the window and appears when the window is closed.

I’ve already checked a lot of things but can’t find the reason for it. The browsers developer tools don’t show any problems.

Maybe grid can’t be stacked in a window that is opend from a button in a layout panel that can hide and show? Or do we probaly have too many widgets in the same view? The count of contact rows to display is definitely not the reason beause all the problems are the same with only 10 contacts.

Any idea what is going wrong?

Best regards,
Frank

[Peter StoevKeymaster]

Hi Frank,

Could you share a codepen or jsfiddle example which demonstrates the reported behavior?

Best Regards,
Peter Stoev

jQWidgets team
https://www.jqwidgets.com

[NightWizzardParticipant]

Hi Peter,

I’m afraid it’s not that easy to let you see what problems occur with my code.

Because all the datasources are calling controller methods to get the neccessary data it may take several hours to replace all these with demo data arrays and strip off all other dependencies to create a stand-alone demo that works and can also (re-)produce the same problems while the code is so much simplified. Instead – as a first step – I have uploaded the original HTML- and JavaScript parts of the MVC 5 view to JSFiddle:

Fiddle

With a little luck you’re able to identify the problem directly from code…? If it helps, I also can record a video of the flicker effects so you can see what happens in real environment.

If all that doesn’t help, I finally will try to create that reduced fiddle next weekend. There are some other minor issues I stepped into we may also discuss then.

Thanks in advance,
Frank

[NightWizzardParticipant]

Hi Peter,

did you have time to have a look at my fiddle and did you find a hint for what’s going wrong?

Best regards,
Frank

[Peter StoevKeymaster]

Hi Frank,

Unfortunately, the provided code did not help. We need just a small sample providing step by step instructions in order to identify an issue with our Grid. The issue here seems to be related to z-index i.e you will need to increase or decrease the z-index of the Dialog. If we had an example, we would be able to help more.

Best Regards,
Peter Stoev

jQWidgets team
https://www.jqwidgets.com

[Author]

Posts