Questions on Kendo UI for Angular Forum

1 answer

92 views

Is it possible to use a specific theme using Typescript code, like Bootstrap, specific for the NotificationService (used in an Angular NgRx effect)

I know I need to define a specific style in package.json using:

"@progress/kendo-theme-default": "^6.3.0"

But I like to know if it is possible to target a specific style for a component. So (I realize this is maybe a weird question), component X uses the material theme and component Y the Bootstrap theme.

I am using your NotificationService in an NgRx effect by the way. So I would also be curious if this would be possible.

Notification

answered on 16 Jun 2023

1 answer

147 views

Kendo UI Angular NotificationService gives weird stacked flickering when hiding previous and showing new one.

I am investigating other product lines, currently I am using PrimeNG, and because of some problems I am testing your Kendo UI Notification component. First my code:

    toast$ = createEffect(() =>
        this.actions$.pipe(
            ofType(CoreActions.Toast),
            filter(({message}) => !!message),
            tap(({message, messageType}) => {
                this.currentNotification?.hide();
                this.currentNotification = this.notificationService.show({
                    content: message,
                    hideAfter: 5000,
                    position: {horizontal: 'right', vertical: 'top'},
                    //animation: {type: 'fade', duration: 400}, //NOTE: Adding an animation unfortunately causes the toast to stack very shortly when using the 'hide()' function..
                    type: {style: messageType, icon: true},
                    closable: false //NOTE: If true the 'hideAfter' property is ignored
                });
            })
        ),
    {dispatch: false} // Because only an action is done, we should not redispatch (that would cause an infinite dispatch loop of toasts)
    );

As you can see, my use case is not having stacked notifications but hiding the previous one if a new one arrives. Imagine the scenario, something is saving, and you want to show 'Saving...' and when saving has finished you present 'Saved!'. Having stacked notifications is weird from this perspective.

Now the problem is when having an animation, the hiding and showing gives weird behaviour: for a very short time, the previous message shows up below the current and is hidden (flickering). If I disable the animation it works as expected.

Notification

answered on 16 Jun 2023

1 answer

348 views

Allow user to save tile layout view

I want to give my users the ability to reorder / resize the tiles and the layout, save that as a view, set a default view and then have the option to choose any saved view in the future that auto loads that grid layout.

GridLayout

TileLayout

answered on 16 Jun 2023

1 answer

234 views

Grid - Master/Detail

I thought this would be an easy out of the box, but I was looking to have one detail open at a time. How would I achieved that

thanks in advance

Grid

answered on 15 Jun 2023

0 answers

658 views

How to change expand/collapse icon for Kendo Angular Grid V13

Is it possible to change icon for expande/collapse on MaterDetails Grid?
KendoGrid version in ^13.0.0

Before V13 the icon drawed in UI via icon and css "content">. And we are able just overwrite ::before styl.e.on V13 not it is SVG icon and style override not works any more. not found any infomration on this at https://www.telerik.com/kendo-angular-ui/components/grid/master-detail/ documentation.

Grid

asked on 15 Jun 2023

1 answer

114 views

Multiple filepaths failing to upload with FileSelect

Multiple files will upload if they are all from a single filepath on the users computer, however when files from multiple local paths are selected for upload only the files from the most recently selected filepath will upload. This is all despite the UI window displaying all selected files. Is this a limitation of the component? Or is there something I've missed in the documentation?

FileSelect

answered on 15 Jun 2023

1 answer

258 views

Kendo Column Chart Column Totals

Hi, if we are using Kendo Chart (Angular I believe) on a new project and i need the developers to replicate the example wireframe column chart below.
I have been advised that they can't get the column totals to appear at the top of the columns. Is this possible and if so what do they need to do to get the column totals at the top of the columns using angular?

Any help would be appreciated.

Regards

Alan

Charts

answered on 15 Jun 2023

1 answer

122 views

How to bind pager with http request from service

Hi,

I have a service with a http request to an api that returns a Observable<Pendentes[]>.

I need to call the service in my component, but I can't get the pagination working.

I attached some prints of my code.

Best regards,
Pedro Marquinhos

Pager

answered on 14 Jun 2023

1 answer

306 views

What is the principle of firing uploadProgress event for kendo-upload component?

Hello,

I'm using kendo-upload for uploading files and displaying progress by subscribing to the uploadProgress event.

When [chunkable]="false" it seems that the event is fired every second or less, allowing the developer to show the progress smoothly.

The above is not true when [chunkable] is set to some value, the event is fired only when every next chunk is uploaded. Consider the following settings: [chunkable] = "{ size: 1048576} and file size to upload is 10Mb, in this case, only 10 events are going to be fired with event.percentComplete = 10, 20, 30 .... 100. This prevents me from building a progress indicator that works smoothly enough. Any ideas about getting uploadProgress fired during the chunk upload more often than once at the end?

Upload

answered on 12 Jun 2023

1 answer

234 views

Kendo pdf export issue - PNG export doesn't have SVG background image and doesn't respect font face

Hi

I have simple page

<kendo-pdf-export #svgPrint>
<svg width="600" height="450" style="background-color: white">>
<defs>
<pattern id="colorBack" x="0" y="0" width="600" height="400" viewBox="0 0 600 400"
preserveAspectRatio="xMidYMax slice" patternUnits="userSpaceOnUse">
<image xlink:href="assets/anthrazit.png"></image>
</pattern>
</defs>
<rect class="profile" x="0" y="0" width="600" height="400" fill="url(#colorBack)" stroke="#555E5E"></rect>
<text fill="gray" class="dimensions-text" x="0" y="420" text-anchor="start"> 5890 </text>
</svg>
</kendo-pdf-export>

I see in a browser this:

But in exported PNG file, there is no background and there is default font instead of specified in css:

i created also a div with paragraph and it works fine.

<kendo-pdf-export #divPrint style="background-color: white; width: 600px; height: 450px;">
<div style="width: 600px; height: 400px; background-image: url('assets/anthrazit.png');">
&nbsp;
</div>
<p class="dimensions-text"> 5890 </p>
</kendo-pdf-export> 

I attached example app with issue reproduction.

--

Best regards

Kamil Paszkiewicz

PDF Export

updated answer on 12 Jun 2023