I am dusting off an old html page I have not used in a few years that pulls data from google sheets. I had a bunch of them that worked just fine a few year but are not working anymore.
This is the code that is failing in my Javascript:
var docfile = new google.visualization.Query('https://spreadsheets.google.com/pub?key=10LWh5nrLxxxxxxxxxxxxxxx', {sendMethod: 'auto'});
docfile.setQuery('select A, B, C, D, E, F');
docfile.send(handleQueryResponse);
When I load the page I get this error:
TypeError: Cannot read properties of undefined (reading 'Query')
The spreadsheet is still there with the same key ID and nothing has changed there.
Is google.visualization.Query not supported anymore?
Is there a new method to reference the data from google sheets?
According to the documentation (and because it's a "old html page") you can try to update the Library Loader Code
<script src="https://www.gstatic.com/charts/loader.js"></script>
<script>
google.charts.load('current', {packages: ['corechart']});
google.charts.setOnLoadCallback(drawChart);
...
</script>
Change the script from www.gstatic.com/charts/loader.js to www.google.com/jsapi
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
Related
I am new to Google analytics and Google Tag Manager and currently I am confused with using external JS libraries. Any help would be appreciated.
I need to use 'https://cdnjs.cloudflare.com/ajax/libs/fingerprintjs2/2.1.0/fingerprint2.min.js' in my custom javascript code in google tag manager. I have tried to include the script as a custom html or even custom template. The script is successfully added to the head and I see it in the inspection. But in my custom JS code , when I try to call and use library functions , it throws exception saying that the lib object is not defined.
I tried sequencing tags also , to make sure script loading tags are fired before my custom js code execution. But that did not fix the problem.
Any suggestion on how to include external JS libraries in your GTM custom JS code? I hope I explained the problem properly.
Thanks !
This example posted by jwest75674 should help. As you need to declare var = fingerprint in your script to allow Google Tag Manager to capture the data after the script has run
In short, you can copy the script below an add it as Custom HTML Tag in GTM (https://github.com/Valve/fingerprintjs2)
<script src="https://cdn.jsdelivr.net/npm/fingerprintjs2#2.1.0/dist/fingerprint2.min.js"></script>
<script type="text/javascript">
var fingerprint; // Variable to allow the Google Tag Manager to capture the data after this script has run.
if (window.requestIdleCallback) {
requestIdleCallback(function () {
Fingerprint2.get(function (components) {
console.log(components) // an array of components: {key: ..., value: ...}
})
})
} else {
setTimeout(function () {
Fingerprint2.get(function (components) {
console.log(components) // an array of components: {key: ..., value: ...}
})
}, 500)
}
</script>
I have added a simple Handlebar to get the content from the JSON data, but iam getting this error - "TypeError: this._input is undefined" in console. iam getting the correct output, but still i get these errors always..
<div class="profileSectionhandle">
<script id="profileTabs" type="text/x-handlebars-template">
{{#profilecontent}}
.......
{{/profilecontent}}
</script>
</div>
var source = $("#profileTabs").html();
var template = Handlebars.compile(source);
$(".profileSectionhandle").html(template(data));
If you were to console.log(source), then it will return undefined. This means that $("#profileTabs").html() isn't in the DOM my the time your code runs, and then you are trying to compile undefined.
Chances are that your page is not loaded by the time your js calls on your handlebars. Either place your function in $(document).ready(function () {...}) if you are working on a web app (with jquery), or $( document ).bind( "pagebeforeshow", function() {...}) for a mobile app (with jquery mobile).
I am trying some AJAX calls for the first time. My site is hosted on my own IIS7, (http://myUserName:8078/HomePage.aspx).
Here is the jScript.
<script type="text/javascript" src="jQuery1.4.2.js"/>
<script type="text/javascript">
$(document).ready(LoadText);
function LoadText() {
$("#Content1").load("data.txt");
}
"content1" is a content place holder.
My IIS is set to .net 4 too.
My problem is that the data.txt contents is never loaded. It is in the same directory as the page. I haven't got much experience in IIS so I am wondering if I am missing a setting or something.
Thanks
You can't use a single-tag XHTML-style script tag for JavaScript. Change your first line to:
<script type="text/javascript" src="jQuery1.4.2.js"></script>
For some reason, the script tag can't be shortened down to just a single tag, you have to have separate opening and closing tags.
I recommend you pass the ClientID and file path into the function as arguments, but the code below should work:
<script type="text/javascript" src='<%= Page.ResolveUrl("~/jQuery1.4.2.js")%>'></script>
<script type="text/javascript">
$(document).ready(function() {
LoadText();
});
function LoadText() {
$("#<%= Content1.ClientID %>").load('<%= Page.ResolveUrl("~/data.txt")%>');
}
</script>
Is data.txt in the root folder of your site? If so, the .load() method takes a URL so try "/data.txt"
LoadText() is a function. Try:
$(document).ready(
LoadText();
);
Also I would suggest using lower camel case for function names. Upper camel case functions as in LoadText() suggests by convention that it is a contructor.
$(document).ready(
loadText();
);
You can also log something in the loadText() function to verify that it actually gets executed.
function loadText() {
$("#Content1").load("data.txt");
console.log('tried to load data.txt');
}
I'm using DNN 5.4 with the default google api jquery reference:
I have confirmed that jquery.min.js is loading. I don't know if there's other jQuery (other than the plugin) that needs to be loaded.
I'm utilizing the Google Code jQuery Textbox Watermark Plugin (Link)
Web Dev Toolbar & Firebug suggest that both jQuery and the Watermark Plugin are loading. This code is sitting near the top of my skin .ascs:
<script type="text/javascript" src="/js/watermark/jquery.watermark.min.js"></script>
The following code works (when the inputs are wrapped in form tags) in basic html document. However, when placed inside either a DNN skin or DNN module, it fails to work and generates a javascript here.
<script language="javascript" type="text/javascript">
(function ($) {
$(document).ready(function () {
jQuery("#xsearch").watermark("Leave blank for USA");
})
})(jQuery);
</script>
SearchString: <input type="text" id="xsearch" name="xsearch" />
<input type="button" value="search" id="xsubmit" name="xsubmit" />
The Error (FireBug):
jQuery("#xsearch").watermark is not a function
[Break on this error] jQuery("#xsearch").watermark("Leave blank for USA");
This alternate code produces the same error:
<script language="javascript" type="text/javascript">
jQuery.noConflict();
jQuery(function () {
jQuery("#xsearch").watermark("Leave blank for USA");
jQuery("#xsubmit").click(
function () {
jQuery("#xsearch")[0].focus();
}
);
});
</script>
And finally, the same error is produced when I replace jQuery with $
It feels like a conflict of some sort, but I'm lost on what to do next.
Thanks in advance for your time
I noticed this is because :
<script type="text/javascript" src="/js/watermark/jquery.watermark.min.js">
should be
<script type="text/javascript" src="js/watermark/jquery.watermark.min.js">
If you are having js folder in your skin root.
You can see FireBug's net tab to make sure your script reference is loading properly. I'm judging this because I've done lots of dnn development and the link you referenced will become
http://www.mydomain.com/tabId/80/js/watermark/jquery.watermark.min.js when http://www.mydomain.com/tabId/80/Default.aspx is served
I'm using update panel, my response have some javascript like bellow. After a success response, I need to eval it, load it (with external script)
ex: my html response
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript">
alert('asd');
</script>
<div>test</div>
<div>blah blah blah</div>
I'm not sure whether this question is still important for you, however I will try to provide a reasonable answer below.
AJAX framework does not evaluate scripts which are returned via UpdatePanel calls. You have to re-attach external scripts to document, so that browser could request for them and evaluate all inline scripts. You can use a small module I have paste below.
var UpdatePanelEnhancer = function ()
{
var divSelector = '#liveArea';
function evaluateScripts()
{
$(divSelector).find('script').each(function ()
{
if (this.src)
{
$('body').append(this);
}
else
{
var content = $(this).html();
eval(content);
}
});
};
Sys.Application.add_load(evaluateScripts);
} ();
The weak part of it is that you have to provide a selector for the element where module should look for a scripts to evaluate ('liveArea' in example), although you can extend the module and provide some cinfiguration to it. Also, I would strongly recommend you to load external javascripts before. If you cannot do it for some reason you should additionally check whether script is already referenced or not to avoid necessary calls and potentially unexpected behaviors and errors .