I have a map with google maps api, and a table, which I want to connect to the map with dHTMLx Layout. (I'm a beginner, so sorry about the question, but I haven't found any solution yet, and I already checked the references in the code) I have this code:
<head>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8">
<title>Map</title>
<link rel="stylesheet" type="text/css" href="dhtmlxlayout_dhx_skyblue.css">
<link rel="stylesheet" type="text/css" href="dhtmlxlayout.css">
<script type="text/javascript" src="dhtmlxlayout.js"></script>
<script type="text/javascript" src="dhtmlxcommon.js"></script>
<script type="text/javascript" src="dhtmlxcontainer.js"></script>
<script type="text/javascript" src="dhtmlxlayout_deprecated.js"></script>
</head>
<body>
<script>
var dhxLayout = new dhtmlXLayoutObject(document.body, "2U");
dhxLayout.cells("a").setText("Térkép");
dhxLayout.cells("a").attachURL("googleapi.html");
dhxLayout.cells("b").setText("Táblázat");
dhxLayout.cells("b").setWidth(500);
dhxLayout.cells("b").attachURL("list.html");
</script>
</body>
What does the 2 error means? ReferenceError: dhtmlxCellObject is not defined & TypeError: this._hdrInit is not a function both in dhtmlxlayout.js
What should I correct? The googleapi.html and list.html are working fine separate.
Thanks!
There is a special option for using google maps in dhtmlx layout - attachMap
Online sample
and
Documentation
will help you
By the way Google doesn't allow to use its servise in iframes
Plus if you don't use deprecated dhtmlx methods, you don't need to include this file in the page
Related
According to documentation these are the files that need to be added
<script src="https://unpkg.com/#progress/kendo-vue-charts#latest/dist/cdn/js/kendo-vue-charts.js"></script>
<script src="https://unpkg.com/#progress/kendo-vue-intl#latest/dist/cdn/js/kendo-vue-intl.js"></script>
<script src="https://unpkg.com/#progress/kendo-drawing/dist/cdn/js/kendo-drawing.js"></script>
// Load the Kendo Default Theme
<link rel="stylesheet" href="https://unpkg.com/#progress/kendo-theme-default#latest/dist/all.css">
// Load the Kendo Bootstrap Theme
<link rel="stylesheet" href="https://unpkg.com/#progress/kendo-theme-bootstrap#latest/dist/all.css">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<link rel="stylesheet" href="https://unpkg.com/#progress/kendo-theme-default#latest/dist/all.css">
<link rel="stylesheet" href="https://unpkg.com/#progress/kendo-theme-bootstrap#latest/dist/all.css">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://unpkg.com/#progress/kendo-vue-charts#latest/dist/cdn/js/kendo-vue-charts.js"></script>
<script src="https://unpkg.com/#progress/kendo-vue-intl#latest/dist/cdn/js/kendo-vue-intl.js"></script>
<script src="https://unpkg.com/#progress/kendo-drawing/dist/cdn/js/kendo-drawing.js"></script>
The Error is
Cannot read properties of undefined (reading 'support') at Module. (kendo-vue-charts.js:1:28556)
The order of the script tags is wrong - we need to put the drawing script tag first, then the intl and last but not least the charts script.
I'm working on .net 5 blazor wasm project. I recently updated my Visual Studio 2019 to version 16.10.0. All of a sudden I started getting an error message in my browser (Google Chrome) console as shown below:
Refused to load the script
'https://localhost:44340/_framework/aspnetcore-browser-refresh.js'
because it violates the following Content Security Policy directive:
"script-src 'sha256-fa5rxHhZ799izGRP38+h4ud5QXNT0SFaFlh4eqDumBI='".
Note that 'script-src-elem' was not explicitly set, so 'script-src' is
used as a fallback.
I don't have _framework/aspnetcore-browser-refresh.js added in my index.html. Here is the scripts and styles declaration in my index.html
styles declared inside <head> in index.html:
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>App</title>
<base href="/" />
<link href="css/site.css" rel="stylesheet" />
<link href="Web.styles.css" rel="stylesheet">
<link href="_content/BlazorDateRangePicker/daterangepicker.min.css" rel="stylesheet" />
<link href="manifest.json" rel="manifest" />
<link rel="apple-touch-icon" sizes="512x512" href="icon-512.png" />
</head>
scripts in index.html:
<script src="_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script>
<script src="_framework/blazor.webassembly.js"></script>
<script src="js/Chart.js"></script>
<script src="js/print.js"></script>
<script src="js/pdf.js"></script>
<script src="_content/BlazorDateRangePicker/clickAndPositionHandler.js"></script>
<script src="js/blazorInterop.js"></script>
<script>navigator.serviceWorker.register('service-worker.js');</script>
But when I launch the app via visual studio, from the browser I can see that _framework/aspnetcore-browser-refresh.js gets appended to scripts section in my index.html. Here is the screen print.
This is anything related to my configuration error? or I need to setup CSP in my index.html? Please assist.
Looks like /_framework/aspnetcore-browser-refresh.js script belongs to a new Hot Reload feature.
Something was broken due to upgrade because message: it violates the following Content Security Policy directive: "script-src 'sha256-fa5rxHhZ799izGRP38+h4ud5QXNT0SFaFlh4eqDumBI='" says thay you have CSP script-src 'sha256-fa5rxHhZ799izGRP38+h4ud5QXNT0SFaFlh4eqDumBI=', but at the same time you load a lot of scripts:
<script src="_content/Microsoft.AspNetCore.Components.WebAssembly.Authentication/AuthenticationService.js"></script>
<script src="_framework/blazor.webassembly.js"></script>
<script src="js/Chart.js"></script>
<script src="js/print.js"></script>
<script src="js/pdf.js"></script>
<script src="_content/BlazorDateRangePicker/clickAndPositionHandler.js"></script>
<script src="js/blazorInterop.js"></script>
<script>navigator.serviceWorker.register('service-worker.js');</script>
At least you need to have 'self' in the script-src directive. Also the sha256-fa5rxHhZ799izGRP38+h4ud5QXNT0SFaFlh4eqDumBI= hash value does not match the hash of your navigator.serviceWorker.register('service-worker.js'); inline script.
You should have a lot of CSP errors in the console.
I'm pretty new to Vue/Vuetify, I've tried using the vuetify v-text-field tag with outline prop.
Why the label is like in the image?
Also the font seems not to be the Vuetify one.
My index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>test</title>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/#mdi/font#4.x/css/materialdesignicons.min.css" rel="stylesheet">
</head>
<body>
<noscript>
<strong>We're sorry but test doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>
Wrap your App.vue in <v-app>. Among other things, it wraps the app in the v-application class which a lot of styles use as part of their selector. From the docs:
The v-app component is REQUIRED for all applications. This is the mount point for many of Vuetify’s components and functionality and ensures that it propagates the default application variant (dark/light) to children components and also ensures proper cross-browser support for certain click events in browsers like Safari. v-app should only be rendered within your application ONCE.
I've added keystone to my existing MERN server with webpack. Server started with no error.
However, when I try to access /keystone/signin (which redirected by /keystone) it gives a blank page and console error Uncaught SyntaxError: Unexpected token < from signin?from=/keystone/js/packages.js:1 and signin?from=/keystone/js/signin.js:1
The content in signin.js is
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Sign in to OneCharge</title>
<link rel="stylesheet" href="/keystone/styles/keystone.min.css">
<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
</head>
<body>
<div id="signin-view"></div>
<script>
var Keystone = {"adminPath":"/keystone","brand":"My Site","csrf":{"header":{"x-csrf-token":"vIRAZlZwZae640a645fd60ed9e8ca9911111a05ce088c8095c"}},"from":"/keystone/js/signin.js","userCanAccessKeystone":false};
</script>
<script src="/keystone/js/packages.js"></script>
<script src="/keystone/js/signin.js"></script>
</body>
</html>
Any hints to solve that could help.
I found a solution to the problem, answering my own question here.
Turns out following the guide here doesn't work for me How to add keystone to an existing express app.
After looking up the code from keystone repository. I found a test project that have everything I need and maybe other people who want to use keystone.
I followed the configuration from the test project repo and work like a charm!
I have created a dojo based Worklight project and a hybrid application it.
I did a drag and drop of a dojo mobile button which gets added inside a dojo mobile view. All of this works fine and renders fine in the various environments (common, android etc.). It also correctly shows the look and feel in Rich Page Editor.
But then i added a script that has a very simple dojo.ready call. Now when i run this application i get a console error saying ReferenceError: dojo is not defined. Any idea why that is happening?
I know that i have correctly setup the dojo as other pieces seem to work. I have also checked that the dojo.js is loading (which is obvious as the other pieces are working). I am using IBM Worklight 6.0 developer edition with all capabilities installed.
Here is my sample code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>jmdwl</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon.png">
<link rel="stylesheet" href="css/jmdwl.css">
<script>window.$ = window.jQuery = WLJQ;</script>
<script type="text/javascript" src="dojox/mobile/deviceTheme.js"></script>
<script type="text/javascript" data-dojo-config="isDebug: false, async: true, parseOnLoad: true, mblHideAddressBar: false" src="dojo/dojo.js"></script>
<script>
dojo.ready(function() {
alert("Here");
});
</script>
</head>
<body id="content" style="display: none;">
<div data-dojo-type="dojox.mobile.ScrollableView" id="view0" data-dojo-props="selected:true">
<!--application UI goes here-->
<button data-dojo-type="dojox.mobile.Button">Label</button>
</div>
<script src="js/initOptions.js"></script>
<script src="js/jmdwl.js"></script>
<script src="js/messages.js"></script>
</body>
</html>
Thanks,
Gaurav
If you want to use dojo.ready you must initialize it first.
<script>
require(["dojo/ready"], function(ready){
ready(function() {
alert("Here");
});
});
Here's the reference : http://dojotoolkit.org/reference-guide/1.8/dojo/ready.html#dojo-ready
Update 1
Which Version of dojo do you use by now? 1.6 or 1.7+ ?
The new AMD requires to initialize the modules like i write before.
Have you read this threads? There seem to be an failure while importing the dojo Libarys. I guess this could have something to do with your error.
worklight fail to require DOJO Combobx on real device -fail to load ... /dijit/form/nls/it/ComboBox.js
and
Worklight core-web-layer.js errors
Regards, Miriam