Telerik Forums
Kendo UI for jQuery Forum
1 answer
59 views

If you have a page with Telerik UI for ASP.NET AJAX RadHtmlChart and try to add Kendo UI for jQuery Notification to that page...

The JavaScript:

var notif = jqueryobject.kendoNotification({appendTo: "#appendto"}).data("kendoNotification");

You cannot call notif.show() because notif is undefined.

We added a kendoNotification to our skin and on pages that use Telerik UI for ASP.NET AJAX RadHtmlChart causes this problem. Other pages with other Telerik UI for ASP.NET AJAX controls work fine.

We have also seen this issue on one other Telerik UI for ASP.NET AJAX control: RadClientDataSource

Any work-around to get this working?

Neli
Telerik team
 answered on 07 Jun 2024
1 answer
281 views

Wondering if someone can point out how to use CSP compatible templates with KendoNotifications.

Here is kendo's demo https://demos.telerik.com/kendo-ui/notification/templates.

 

I've added a content-policy without 'unsafe-eval' included. https://dojo.telerik.com/urImEZAk

Is there a way to convert these templates to be CSP compatible while keeping them in the script statement instead of having the html inside the kendoNotification initialize? The kendo documentation doesn't have many examples. https://docs.telerik.com/kendo-ui/framework/templates/get-started-csp-templates

This works, but would be nice to be able to separate the templates. https://dojo.telerik.com/urImEZAk/4

Thanks.

Zornitsa
Telerik team
 answered on 14 Jul 2023
1 answer
912 views
I can now do it in the 'show' event, but since showing of notification is animated, so the color is changed after some delay, and I don't want to give up using animation. Is there a better way I can customize the notification color? Thank you.
Neli
Telerik team
 answered on 09 Jun 2022
1 answer
493 views

Hi team,

I'm trying to setup notifications on my project, using your demo : https://demos.telerik.com/kendo-ui/notification/templates. I managed to make notifications appears like in your tutorial, but they are not stacking when multiple of them are open in the same time. 

Here's my code : 

function showNotification(_title, _txt, _type) {
    var notification = $("#notificationPopup").kendoNotification({
        position: {
            pinned: true,
            top: 30,
            right: 30
        },
        autoHideAfter: 0,
        stacking: "down",
        templates: [{
            type: "success",
            template: $("#successTemplate").html()
        }, {
            type: "warning",
            template: $("#warningTemplate").html()
        }, {
            type: "error",
            template: $("#errorTemplate").html()
        }]
    }).data("kendoNotification");
 
    notification.show({
        title: _title,
        message: _txt
    }, _type);
}

 

<span id="notificationPopup" style="display:none;"></span>
 
<script id="successTemplate" type="text/x-kendo-template">
    <div class="notifSuccess">
        <h3>#= title #</h3>
        <p>#= message #</p>
    </div>
</script>
 
<script id="warningTemplate" type="text/x-kendo-template">
    <div class="notifWarning">
        <h3>#= title #</h3>
        <p>#= message #</p>
    </div>
</script>
 
<script id="errorTemplate" type="text/x-kendo-template">
    <div class="notifError">
        <h3>#= title #</h3>
        <p>#= message #</p>
    </div>
</script>

 

I call showNotification() whenever I want one to appear, but they do one in front each other instead of stacking in the direction I indicated.

 

Any idea of what I missed ?

 

Best regards,

 

Valentin

 
Valentin
Top achievements
Rank 1
Veteran
 answered on 20 Apr 2021
1 answer
228 views

Hello,

I'm doing some research on behalf of my team and have been looking for documentation that discusses linking functionality from notification pop-ups. This may be an easy thing to do but I am not a programmer (sorry!).  Can anyone confirm that it is possible to embed links in the notifications? 

For example: Worker A completes work that automatically is assigned to Worker B.  When Worker A completes their work the system auto-generates a notification to Worker B letting them know work has been assigned to them.  Worker B can either hit the X to dismiss or click the body of the notification to link them to the application page that requires their attention. 

Any help on this is much appreciated!

Cheers

Stoyan
Telerik team
 answered on 26 Feb 2021
3 answers
816 views

Hello!

How can I make info and success notifications disappear automatically after a few seconds, but have warning and error notifications to be closed manually by the user?

Best regards,

Kaan

Ryan
Top achievements
Rank 1
 answered on 24 Feb 2020
3 answers
836 views

Hi, 

How can i apply different autoHide duration for different types of notifications? A success message should auto hide after 5sec, but the rest must not autohide.

I looked at this thread, https://www.telerik.com/forums/different-closing-behaviour-for-notifications , but it does work completely. When the info window hides, it hides everything, not just the info window.

Please Advise,

Grant

Ivan Danchev
Telerik team
 answered on 12 Feb 2020
3 answers
595 views
I've defined a notification on my JSP page using the jsp taglib, and it works great if I'm using it in javascript from button actions or click events.  But if I try to access it as part of my ready function processing the following call returns 'undefined'.
var notification = $("#notification").data("kendoNotification");
It almost makes me think the widget hasn't fully initialized or something.  I want to avoid having to define everything via JS in the ready function, since that defeats the purpose of even having the taglib.  Am I doing something wrong, or is this not possible?
Thanks
ROBBE
Top achievements
Rank 1
Iron
Iron
 answered on 16 Sep 2019
3 answers
295 views

I have an application that displays errors with the notification that uses templates.

One of the errors that I got was a telerik error that the template was wrong however the displayed message has interpreted the html code.

Looking in the documentation I saw that to encode the html you should use showText instead of show so I used it but the notification displayed the same thing. The html was not encoded.

Please see the reproduction

https://dojo.telerik.com/eNaBikIm

What can I do so that the message is not interpreted?

Nencho
Telerik team
 answered on 25 Oct 2018
Narrow your results
Selected tags
Tags
Grid
General Discussions
Charts
Data Source
Scheduler
DropDownList
TreeView
MVVM
Editor
Window
DatePicker
Spreadsheet
Upload
ListView (Mobile)
ComboBox
TabStrip
MultiSelect
AutoComplete
ListView
Menu
Templates
Gantt
Validation
TreeList
Diagram
NumericTextBox
Splitter
PanelBar
Application
Map
Drag and Drop
ToolTip
Calendar
PivotGrid
ScrollView (Mobile)
Toolbar
TabStrip (Mobile)
Slider
Button (Mobile)
SPA
Filter
Drawing API
Drawer (Mobile)
Globalization
LinearGauge
Sortable
ModalView
Hierarchical Data Source
Button
FileManager
MaskedTextBox
View
Form
NavBar
Switch (Mobile)
SplitView
ListBox
DropDownTree
PDFViewer
Sparkline
ActionSheet
TileLayout
PopOver (Mobile)
TreeMap
ButtonGroup
ColorPicker
Pager
Styling
MultiColumnComboBox
Chat
DateRangePicker
Dialog
Checkbox
Timeline
Drawer
DateInput
ProgressBar
MediaPlayer
ImageEditor
OrgChart
TextBox
Effects
Accessibility
PivotGridV2
ScrollView
BulletChart
Licensing
QRCode
ResponsivePanel
Switch
Wizard
CheckBoxGroup
TextArea
Barcode
Breadcrumb
Collapsible
Localization
MultiViewCalendar
Touch
RadioButton
Stepper
Card
ExpansionPanel
Rating
RadioGroup
Badge
Captcha
Heatmap
AppBar
Loader
Security
Popover
DockManager
FloatingActionButton
TaskBoard
CircularGauge
ColorGradient
ColorPalette
DropDownButton
TimeDurationPicker
ToggleButton
BottomNavigation
Ripple
SkeletonContainer
Avatar
Circular ProgressBar
FlatColorPicker
SplitButton
Signature
Chip
ChipList
VS Code Extension
AIPrompt
PropertyGrid
Sankey
Chart Wizard
OTP Input
SpeechToTextButton
InlineAIPrompt
StockChart
ContextMenu
TimePicker
DateTimePicker
RadialGauge
ArcGauge
+? more
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jay
Top achievements
Rank 3
Bronze
Iron
Iron
yw
Top achievements
Rank 2
Iron
Iron
Stefan
Top achievements
Rank 2
Iron
Iron
Iron
Kao Hung
Top achievements
Rank 1
Iron
Bohdan
Top achievements
Rank 2
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?