I'm trying to build an offline web form. It only uses jQuery and twitter bootstrap as external resources. I've tried to cache them but when I refresh offline I get net::ERR_FAILED for both jQuery and bootstrap. I'm very new to AppCache so any help is appreciated. Here is my manifest and where I'm including things in my html:
CACHE MANIFEST
../style-bootstrap.css
http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js
NETWORK:
*
HTML:
<!DOCTYPE html>
<html lang="en-us" manifest="/includes/pouchcontacts.manifest" type="text/cache-manifest">
<head>
<meta charset="utf-8" />
<title>Contacts [OFFLINE]</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="style-bootstrap.css">
</head>
Related
I am wondering how Apache Mesos implements the front-end web ui (localhost:port) in which users can track the system's current status and the submitted jobs. Is there any library for this? How does Mesos do this (in C++)?
Well, having a look at the source code reveals what it's using:
<!DOCTYPE html>
<html lang="en" ng-app="mesos">
<head>
...
<link href="/static/css/bootstrap-3.3.6.min.css" rel="stylesheet">
...
</head>
<body>
...
<script src="/static/js/jquery-1.7.1.min.js"></script>
<script src="/static/js/underscore-1.4.3.min.js"></script>
<script src="/static/js/zeroclipboard-1.1.7.js"></script>
<script src="/static/js/angular-1.2.3.min.js"></script>
<script src="/static/js/angular-route-1.2.3.min.js"></script>
<script src="/static/js/ui-bootstrap-tpls-0.9.0.min.js"></script>
...
</body>
</html>
So, it's using
Angular
jQuery
Bootstrap
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.
Could you please help me to detect and fix same bug in the simple Click Counter application.
I generated the Click Counter application from Dart Editor (New project -> simple web application using polymer library..)
Now I want to add Social Likes functionality (see http://sapegin.github.io/social-likes/.)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sample app</title>
<!-- include the web_components polyfills with support for Dart. -->
<script src="packages/web_components/platform.js"></script>
<script src="packages/web_components/dart_support.js"></script>
<!-- import the click-counter -->
<link rel="import" href="clickcounter.html">
<link rel="stylesheet" href="cc.css">
<link rel="stylesheet" type="text/css" href="social-likes_birman.css" />
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript" src="social-likes.min.js"></script>
</head>
<body>
<h1>Cc</h1>
<p>Hello world from Dart!</p>
<div id="sample_container_id">
<click-counter count="5"></click-counter>
</div>
<div class="social-likes">
<div class="facebook">Facebook</div>
<div class="twitter">Twitter</div>
<div class="plusone">Google+</div>
</div>
<!-- bootstrap polymer -->
<script type="application/dart">export 'package:polymer/init.dart';</script>
<script src="packages/browser/dart.js"></script>
</body>
</html>
This code works perfect in Dartium and Chrome, but doesn't work in Firefox (the styles of Social Likes is not applied! The web console of FireFox doesn't contain any error..
Dart Editor version 1.7.0.dev_04_06 (DEV)
Dart SDK version 1.7.0-dev.4.6
Firefox 33
The code of application is attached to this issue.
I really don't understand what is wrong. Is there a bug in FireFox or polymer or dart2js? This bug is very critical for me...
I am trying to get started with kendo ui core. I followed the instructions at
http://docs.telerik.com/kendo-ui/getting-started/introduction?utm_source=telerik&utm_medium=email&utm_campaign=kuicore1
which say to include a link to the file js/kendo.web.min.js but this file was not in the kendoui.core download.
I tried substituting js/kendo.web.min.js for js/kendo.core.min.js which was in the download but that doesn't work either.
I am also getting a javascript console error on a file I've not even called.
GET /telerik.kendoui.2014.1.416.core/js/jquery-1.9.1.js 404 (Not Found)
I tried including both a local copy of jquery-1.9.1.js and a link to google cdn which removed the 404 error but still the kendo ui components don't work.
Please help me get started, thanks
<!doctype html>
<html>
<head>
<title>Kendo UI Web</title>
<link href="styles/kendo.common.min.css" rel="stylesheet" />
<link href="styles/kendo.default.min.css" rel="stylesheet" />
<script src="js/jquery.min.js"></script>
<script src="js/kendo.core.min.js"></script>
</head>
<body>
<input id="datepicker" />
<script>
$(function() {
$("#datepicker").kendoDatePicker();
});
</script>
</body>
</html>
If you use Kendo UI Professional then you can use core and you have all the JavaScript needed in one single file (kendo.web.min.js) -except jQuery- but this includes a lot of code that you might not need. That's why Telerik also distributes the separate files making your life harder but your web more efficient.
You can use the following example and then you don't need to setup anything else. If you copy this to a file and open it in a browser it should work...
<!doctype html>
<html>
<head>
<title>Kendo UI Web</title>
<link href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.1.416/styles/kendo.default.min.css" rel="stylesheet" />
<script src="http://cdn.kendostatic.com/2014.1.416/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.416/js/kendo.ui.core.min.js"></script>
</head>
<body>
<input id="datepicker" />
<script>
$(function() {
$("#datepicker").kendoDatePicker();
});
</script>
</body>
</html>
But this is not efficient because you are loading all the widgets and you are bringing them from internet.
BUT if you want to use Kendo UI CORE the file that you need to include with all the widgets (included in this core) is NOT kendo.core.min.js but kendo.ui.core.min.js. So your code should be:
<!doctype html>
<html>
<head>
<title>Kendo UI Web</title>
<link href="./styles/kendo.common.min.css" rel="stylesheet" />
<link href="./styles/kendo.default.min.css" rel="stylesheet" />
<script src="./js/jquery.min.js"></script>
<script src="./js/kendo.ui.core.min.js"></script>
</head>
<body>
<input id="datepicker" />
<script>
$(function() {
$("#datepicker").kendoDatePicker();
});
</script>
</body>
</html>
BUT it seems that you want to deploy it in your server / computer instead of from internet. Then you need to copy to your system:
JavaScript:
js/jquery.min.js
js/kendo.ui.core.min.js
CSS:
styles/kendo.common.min.css
styles/kendo.default.min.css
plus files used by Default style:
styles/Default/editor.png
styles/Default/imagebrowser.png
styles/Default/indeterminate.gif
styles/Default/loading.gif
styles/Default/loading-image.gif
styles/Default/loading_2x.gif
styles/Default/slider-h.gif
styles/Default/slider-v.gif
styles/Default/sprite.png
styles/Default/sprite_2x.png
All this files are referenced by kendo.default.min.css and you will find them in the downloaded zip containing Kendo UI Core.
I'm trying to make a PhoneGap app using jquerymobile, but it doesn't seem to work...
In my index.html I wrote below code;
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />
<meta charset="utf-8">
<link rel="stylesheet" href="css/jquery.mobile-1.1.0.min.css"/>
<script type="text/javascript" charset="utf-8" src="cordova-1.8.1.js"></script>
<script type="text/javascript" charset="utf-8" src="javascripts/jquery-1.7.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="javascripts/jquery.mobile-1.1.0.min.js"></script>
<script type="text/javascript">
</script>
I put jquery mobile files into my www file.
Could someone teach me how to read jquery file using PhoneGap??
I'm sorry for my English is not good...
Thank you in advance.
I have some sample applications in github repository which you can use for reference.
cordova-examples
phonegap with jquery mobile