I have an angular-slick grid with an enabled header menu option. I want to scroll down and use the other option in the slick grid header menu. But we cant able to use the scrolling option. This is an issue I'm facing in the slick grid header menu.
Current Behavior
We cant use the remove filter option and the appearance of the header menu is not good.
We cant scroll the header menu. So this is our a major issue.
Expected Behavior
Is any solutions like to increase the Div height or else we put a scroll for the header menu.
Kindly provide the solution for this UI issue in the slick grid.
Software Version
Angular : 11.2.18
Angular-Slickgrid : 2.30.4
TypeScript : 4.1.5
Operating System : Windows 10
Node : 14.18.3
NPM : 6.14.8
Related
I recently started working with Kendo UI grid with Angular.
After some testing I discovered the lack of timepicker filter menu component and decided to make my own.
The problem is when I use the Kendo UI timepicker in the template and choose a time, the filter menu automatically closes.
Here is a stackblitz to reproduce the issue:
https://stackblitz.com/edit/kendo-ui-angular-grid-filter-menu-kendo-timepicker-issue?file=app/app.component.ts
A small note: The reason I extended the DateFilterMenuComponent in my custom TimeComponent is that I have the same operators as date related values which is okay and to gain easy access to other common filter properties (example logic operators).
Can someone help me out with the menu not closing when a time is selected?
So far I tried the following:
On the timepicker I tried
(click)="$event.preventDefault(); $event.stopPropagation()"
That results into the timepicker not closing but the filter menu still closes.
I found the answer after contacting Telrik support, they pointed me to
https://www.telerik.com/kendo-angular-ui/components/grid/filtering/reusable-filter/#toc-filter-menu-with-popup
The problem is that the timepicker is being rendered in the body/root component and the filter menu is (by default) configured to close when a user clicks outside the filter menu content.
Here is the documentation mixed with my problem fixed in stackblitz:
https://stackblitz.com/edit/kendo-ui-angular-grid-filter-menu-kendo-timepicker-issue-vzitmn?file=app/filters/menu/time/time.component.ts
The site I'm working on has its main menu in the "Navigation" section in gantry. I have another 2 menus on the page (in the "header" area), though they don't actually link anywhere. They exist as "text separators" that show a module in the dropdown box that shows when the "link" is hovered over (so one is a spyglass that shows the search module in the dropdown).
When i shrink the screen size, gantry eventually causes the menu to disappear an then enables the mobile menu, accessed by the burger button.
The problem is, instead of hiding the actual main menu in the navigation section, it's hiding the first "fake" menu search button in the header section.
I can't see anywhere to set which menu is the one that should be hidden. How do i do this?
Been stuck on this since yesterday. Finally caved and post about it on this site then find the answer 20 minutes later, naturally.
I needed to check the box marked "Mobile Target" on the menu i want to be the one to be hidden. I thought this did something else so never tried using it but it seems so obvious now.
I created a prototype for my application. To make the application looks better, I decided to remove the scrollbar. Does anybody know how to make it?
There is two ways (see screenshot, numbers "1" and "2"). Go to region properties, User Interface tab:
(updated) Choose template Alert and set property Alert Icons - Hide Icons to hide alert icon.
or
In Standard template, choose Body Overflow - Hide (as far as I remember, this option present only in Oracle APEX 5.0 and higher)
Hopefully changing the css style helps:
.a-GV-w-scroll {
overflow: hidden!important;
}
See the "inline-css" on this page.
In IcCube reporting,
I added an amchart,
in the widget advanced properties,
I set the Scrollbar.Hide Resize Grips to "no" in order to show the scroll...
The scroll is visible but not the drag icons...
if I look in chrome's debugger, I can see that it's looking for this file : undefineddragIcon.gif 404 (Not Found)
I tested on icCube's livedemo and the problem is the same...
What am I missing there ?
Txs in davance.
The path to images was not set in the icCube's amChart integration.
Will be fixed in the next release.
I want to use Kendo UI rich text Editor inside of ASP.NET page, however when I run the application the editor toolbar is displayed with icons and links, I just want to display icons. How can I fix it?
View the image with the issue toolbar editor...
Normally text in editor icons is hided by setting font size to 0 in kendo CSS file:
.k-button-group .k-tool-icon{
font-size: 0;
}
If you have such behavior, you have instaled Kedno UI wrong or you are overriding their style.
To check if you have installed it correctly read the kendo instalation manual: http://docs.telerik.com/kendo-ui/aspnet-mvc/introduction
If everything is ok you should check in eg. Firebug tool why this font-size is not set to 0.