Similar to a previous post, but this time Im using MVC and the html helper
Using Kendo.MVC ver# 2015.1.318.545
and script ui library 2013.3.1324
#(Html.Kendo().Notification()
.Name("popupNotification")
)
At run time the above results in this code:
<span id="popupNotification"></span><script>
jQuery(function(){jQuery("#popupNotification").kendoNotification({});});
</script>
, in chrome developer tools, I see an error:
Uncaught TypeError: jQuery(...).kendoNotification is not a function
Its strange that I can put in a datepicker in the same spot, but the notification blows chunks.
[ See reply by user Win below - that was the answer ]
Ideally, you want to use all 3 files (CSS and images too) in same version. Otherwise, they will be out of sync.
Kendo.Mvc.dll
kendo.aspnetmvc.min.js
kendo.all.min.js (this might vary if you use individual widget)
FYI: Also make sure that you use Kendo supported jQuery version. New version requires new jQuery version.
Related
I have encountered a strange problem when using angular 2 beta RC.
Events get postponed if I include an external script I wrote into any angular 2 project:
<script>
(function(r,a,k,e,y,o,u){r['RakrWidgetObject']=y;r[y]=r[y]||function(){
(r[y].q=r[y].q||[]).push(arguments)},r[y].l=1*new Date();o=a.createElement(k),
u=a.getElementsByTagName(k)[0];o.async=1;o.src=e;u.parentNode.insertBefore(o,u)
})(window,document,'script','//cht.technology/rakr.js','rakr');
rakr('//localhost:3000', 'RAKR-000001');
</script>
Take github project thelgevold/angular-2-samples for example, once I add the below script as I did in https://github.com/tan9/angular-2-samples/tree/event-postponed branch.
The angular 2 application starts to behave strangely, some event changes won't be taking into account by angular until I trigger another event manually, I have to click a button twice to get correct rendering as this recording I uploaded to imgur
I don't know what's happening to the external script I wrote, it's a simple project that only depends on html2canvas and es6-promise, which can capture screenshot using html2canvas and send it to another web service. The bundle was built by webpack, and I tried to build the bundle by using browersify, with no luck.
This is a caveat with how Zone.js works. Zone.js patches async browser events and provides an API in which Angular uses to determine when changes happen and when to run change detection in order to update the UI.
In the case of your third-party library that uses the browser Promise API, it needs to be loaded before Zone.js is loaded via script tag. This is so that async events are patched so it will be run in the "zone" that Angular runs in. Events running outside the zone won't be picked up unless change detection is run manually, or the event is run in the context of the Angular zone.
As explained by brandon, make the code run inside Angulars zone
inject NgZone
constructor(private ngZone:NgZone){}
...
this.zone.run(() => ... /* code here that modifies Angulars model from the outside */);
You can also get the zone outside Angular
bootstrap(AppComponent, ...).then((ref => ref.instance.injector.get(NgZone));
(Not sure if this is 100% correct, I'm just on my phone and looking up is cumbersome. Please post a comment if you can't make it work.
I am using a javascript library that uses CustomEvent that doesnt seem to be fully supported in Android 4.1. So I thought I'd use Modernizer to conditionally load a CustomEvent polyfill in browsers where it is missing.
I went here: https://modernizr.com/download?customevent-dontmin
Selected 'CustomeEvent',
Downloaded the suggested EventListner.js polyfill,
Pressed 'Build' and downloaded the custom Modernizer.
I added to my index.html: <script src="js/modernizr-custom.js"></script>
And added this to my javascript:
Modernizr.load({
test: Modernizr.customevent,
nope: 'EventListener.js'
});
But I get an error: TypeError: Modernizr.load is not a function
Can someone please confirm I've not gone completely off piste here and I'm using modernizer correctly? And do I have to download another script or something to get the Modernizer.load function? (Modernizer seems to have changed since similar questions were asked).
Modernizr.load was removed from Modernizr
Modernizr.load has been deprecated in favor of using yepnope.js directly; from v3.0, yepnope.js must be included in the page in order for Modernizr.load to work: calling .load() will simply pass the arguments on to yepnope(); this will be removed fully in a future release (#1241)
I have created few maps using the mapit library of Birt. The maps are working fantastic in Birt Designer. However, when I put the same report in Birtviewer, the map does not load. My question is whether this is a compatibility issue of Mapit with java8 or birtviewer that it does not work in birt viewer?
My second question is how can I actually see whether the birt library file is being read correctly and whether it could be a problem with reading the library file?
Arif
Unlike "preview" mode, the frameset servlet loads the report through an ajax query. Problem is the Eclipse Webviewer does not make use of a framework such jquery to handle ajax: only the first html script tag is triggered.
Your sample works with the portlet viewer i developed because jquery handles all this ajax stuff automatically. To make it work with the frameset servlet of the Eclipse WebViewer, i tried a quick and dirty workaround, only tested with Chrome & Firefox:
1/ I added this fragment at the end of your first script tag:
setTimeout(function(){
console.log("Evaluate ajax html...");
var scripts = document.getElementsByName("scriptMap");
for (var i=0;i<scripts.length;i++) {
if (scripts[i].text!=null) eval(scripts[i].text)
}
}, 1000);
2/ I also added a name "scriptMap" allowing to select the 2 remaining script tags For example here is the last script:
<script name="scriptMap">
setTimeout(actuate.birt.maps.google.start, 1);
</script>
This way the sample runs finely with a WebViewer frameset.
Furthermore, if you need to deploy a flat file as relative path you can manage this by using a file URI such described below. It means in your sample you have to declare two distinct datasource, one for each file. I hope it will help.
I'm not sure why, though getting a similar issue.
Trying to load in a font from fonts.com with webfontloader so I can call functions after they're loaded.
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js"></script>
<script>
WebFont.load({
monotype: {
projectId: 'xxxxxxxxxxxxxxxxxxxx'
},
active: function() {
mainNav();
}
});
But when ever I include it WITH the jsapi
<script src="https://www.google.com/jsapi"></script>
I get the following issue in the console:
Uncaught TypeError: Cannot call method 'hasAttribute' of null
Yet if loaded in separately, they're fine...
Any ideas?
Try using the following url to load the webfonts api:
<script src="//ajax.googleapis.com/ajax/libs/webfont/1.1.2/webfont.js"></script>
Check the following post for more details: https://groups.google.com/forum/#!msg/google-ajax-search-api/dWVzQF_YWCM/Y3-R738wh78J
We no longer support partial version aliases for new versions of
libraries. Any partial version aliases already in place will continue
to be supported and updated. The reason is that URLs like
https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js
which is saying "give me the most recent version of jquery 1.x.x) have
very short cache lifetimes since the most recent version can change at
any time. This is bad for performance. This is also bad for your web
site, in the event that a library makes breaking changes in its APIs
between versions that cause your page to suddenly render differently.
Libraries do not usually make such changes intentionally but pages
sometimes depend on behavior of an unspecified corner case of an API
that may be changed intentionally or inadvertently as the library is
updated.
So we strongly recommend that you specify the complete version string
when referencing libraries hosted on the Google AJAX APIs. You can
always find the most recent version at
https://developers.google.com/speed/libraries/devguide. In this case,
the most recent 1.9.x version is currently 1.9.1 so we suggest using
the URL
https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js
to get a stable version and better caching.
(Also, your example above doesn't have a closing </script> tag. Just want to verify this doesn't exist in your own code).
I've found code sample for google autocomplete and created other components for Bing and other search providers, but I can't switch autocompletion. I use following code to change autocompletesearch, but it doesn't work. Component works only if I define autocompletesearch property in XUL.
textbox.setAttribute("autocompletesearch", engine + "-autocomplete");
Worked around that problem by cloning and replacing input field each time I need to change autocomplete source.