Kendo UI mobile and Dataviz - kendo-ui

I am trying to use DataViz with Kendo UI mobile by referencing kendo.all.min.js file. The click events of the listview do not work. If the reference is changed to kendo.mobile.min.js then everything works fine.
Here are the referenced files:
<link href="kendo/styles/kendo.dataviz.mobile.min.css" rel="stylesheet" />
<link href="kendo/styles/kendo.dataviz.flat.min.css" rel="stylesheet" />
<link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
<link href="styles/main.css" rel="stylesheet" />
<script src="cordova.js"></script>
<script src="kendo/js/jquery.min.js"></script>
<script src="kendo/js/kendo.all.min.js"></script>

I am assuming the question here is "How to get the listview click events to work". Without seeing your code, I can only suggest a couple things:
Use the debug/developer tool in Chrome or the AppBuilder simulator and check your console for any reference errors. One reference error or javascript error can cause your whole page to stop working.
In addition, check in your directory ./kendo/js/ and confirm that you actually named the file kendo.all.min.js.
This is a start, hope it helps.

Related

Featherlight external html opening (AJAX)

I'm sorry but I spent long time but can't figure out what is wrong to pop-up the other html file with the Featherlight. The manual says nothing additional so I will be happy if you will guide me what's wrong:
<link href="//cdn.rawgit.com/noelboss/featherlight/1.5.0/release/featherlight.min.css" type="text/css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-latest.js"></script>
<script src="//cdn.rawgit.com/noelboss/featherlight/1.5.0/release/featherlight.min.js" type="text/javascript" charset="utf-8"></script>
Open Ajax Content
<br>
Ver2
<br>
Open Ajax Content
You need to specify the class in your target html page
So within http://www.htmliseasy.com/popup/popup1.html
there should be a content here
(you can rename "jQuery-Selector" whatever you wish...)

MicrosoftAjax.js is not loaded successfully in word web add in

I am building a word web add-in with VS2015 and pretty much randomly (I don't change anything, then get this new error) office.js will crash with the error
0x800a139e - JavaScript runtime error: MicrosoftAjax.js is not loaded successfully.
It is super frustrating because I cannot always repeat the error and the javascript engine afterwards completely crashes causing me to restart visual studio and reload the project (NOT fun when doing a live demo)
EDIT: attached html calling for officejs
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<title></title>
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.min.css">
<link rel="stylesheet" href="https://appsforoffice.microsoft.com/fabric/1.0/fabric.components.min.css">
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js" type="text/javascript"></script>
<!-- To enable offline debugging using a local reference to Office.js, use: -->
<!-- <script src="../../Scripts/Office/MicrosoftAjax.js" type="text/javascript"></script> -->
<!-- <script src="../../Scripts/Office/1/office.js" type="text/javascript"></script> -->
<link href="../App.css" rel="stylesheet" type="text/css" />
<script src="../App.js" type="text/javascript"></script>
<link href="Home.css" rel="stylesheet" type="text/css" />
<script src="Home.js" type="text/javascript"></script>
</head>
I know I am a little late on the answer, but I ran into the same issue. This microsoft dev article addresses and provides the solution to this issue.
https://dev.office.com/blogs/Office-Store-add-in-validation-changes-using-MicrosoftAjax-js
Basically the new office.js script in the html, that used to load microsoft ajax does not any longer since 2016. i.e.
<script src="https://appsforoffice.microsoft.com/lib/1/hosted/office.js" type="text/javascript"></script>
Some functions like Excel.run were checking to make sure microsoft ajax was loaded and not working for me in an Excel add-in. The solution is to just load ajax yourself, or if not using ajax reference the microsoft dev announcement above and load a different office.js package the announcement provides.

Mixed content google chrome, cant find the source

Im developing a golang webpage and am running into some troubles when deploying my page to google app engine (appspot.com). This is because Im running it using http when developing on my machine, but over https when deployed.
Google chrome doesnt like this so it blocks the content trying to be loaded over http. Im fine with this since I like security. But I cant find the source.
All my includes are https or //, or just local files.
Here is a image of the error in chrome.
This is some includes that I use. Maybe some of them is loading a font?
<link href="/static/css/googlefont.css" rel='stylesheet' type='text/css'>
<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="/static/css/style.css" rel="stylesheet" type="text/css">
<link href="/static/css/sweetalert2.css" rel="stylesheet" type="text/css">
<link href="/static/css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="/static/css/modal.css" rel="stylesheet" type="text/css">
<script src="/static/js/jquery.js"></script>
<!--<script src="/static/js/jquery.min.js"></script>-->
<script src="/static/js/register.js"></script>
<script src="/static/js/login.js"></script>
<script src="/static/js/sweetalert2.min.js"></script> <!-- Sweetalert -->
<script src="/static/js/spin.min.js"></script> <!-- ?? -->
<script src="/static/js/bootstrap.min.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="/static/js/jquery.cookie.js"></script>
<script src="/static/js/stuff.js"></script>
<script src="/static/js/flat-ui.min.js"></script>
<script src="/static/js/application.js"></script>
<script src="/static/js/bootbox.js"></script>
I cant seem to find the source..?
Thankful for any help in the right direction, i'm going crazy here..
Check all the CSS stylesheets your document is loading, including any CSS stylesheets that are getting loaded through an #import. In one of the CSS stylesheets, you most likely have a rule with a url(…) call something like this:
src: local('PT Sans'), local('PTSans-Regular'), url(http://fonts.gstatic.com/s/ptsans/v8/fhNmDCnjccoUYyU4ZASaLVKPGs1ZzpMvnHX-7fPOuAc.woff2) format('woff2');
Use the Network tab (or equivalent) in your browser devtools to get a view of all the resources your document is loading. You can sort that resource view by type. So, set it to sort by type and then look through the source of all the type=stylesheet or type=css resources to see which one has a url(…) that uses an insecure http scheme.
If someone hasn't already, there really should be a feature request lodged with Google. The fact that Chrome knows the location of the error but just displays "(index):1" in the developer console just doesn't cut it.
In the meanwhile, the easiest way to find the offending CSS in Chrome (ver 68) is to "Customize and control DevTools" by clicking on the 3 dots in the top right corner of the development console and clicking "Search" ) or "Ctrl+Shift+S". You might have to drag up the horizontal pane at the bottom of the screen.

why kendo.web.min.js and kendo.dataviz.min.js conflicts?

I own a construction grid kendo.web.min.js with kendo.dataviz.min.js, but when I use the Using both collision occurs.
But it is interesting that the project jsfiddle it works well but when I run the project visual studio
I encountered the following error TypeError: s is undefined
jsfiddle code
<link href="css/themes.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<link href="css/base.css" rel="stylesheet" />
<link href="js/kendo/src/styles/kendo.dataviz.css" rel="stylesheet" />
<link href="js/kendo/styles/kendo.silver.min.css" rel="stylesheet" />
<link href="js/kendo/styles/kendo.common.min.css" rel="stylesheet" />
<script src="js/kendo/js/kendo.web.min.js"></script>
<script src="js/kendo/js/kendo.dataviz.min.js"></script>
<script src="js/kendo/src/js/kendo.dataviz.sparkline.js"></script>
They conflict because they include the same files - kendo.data.js, kendo.core.js etc. You should never include them in the same page - use kendo.all.min.js or create a JavaScript file with only the required features.
More info is available in the Kendo UI documentation - JavaScript dependencies.
DataViz script must be put before the Web script.
<script src="js/kendo/js/kendo.dataviz.min.js"></script>
<script src="js/kendo/js/kendo.web.min.js"></script>

VS Annoying CSS Alert

<link href="http://www.../default.css" rel="stylesheet" type="text/css" />
Could not edit 'http://...' because it is not in the Web site.
I get this error box every five minutes, how do I get it to stop telling me this?
<link runat="server" id="defaultCss" rel="stylesheet" type="text/css"/>
and on your code behind
defaultCss.attributes.add("href","http://www..../default.css");
if your css is in your website then you can use
ResolveUrl("~/default.css")
to get the url
or probably best practice is to add it to your app theme folder http://msdn.microsoft.com/en-us/library/ykzx33wh.aspx and then not only will it be automatically added but you'll get intellisense
Well, seems like it's because you're including an href that points to a URL, instead of a relative web path.
Instead of
<link href="http://www.mysite.com/styles/default.css" rel="stylesheet" type="text/css"/>
use
<link href="/styles/default.css" rel="stylesheet" type="text/css"/>
Also, make sure your closing
/>
is valid in terms of your Doctype.

Resources