Javascript can't call an object inside a function - javascript

Sorry, I am new to javascript. I am trying to call an object from inside a function to allow me to get a variable from a flash file at set intervals. For some reason the object is not working inside the timer function.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>DIY Map</title>
<style>
* { margin:0; padding:0; }
</style>
</head>
<body style="font-family:verdana;color:#999; background-image:url('bg.png'); background-repeat:no-repeat;">
<script type="text/javascript" src="js/JavaScriptFlashGateway.js"></script>
<script type="text/javascript" src="js/Exception.js"></script>
<script type="text/javascript" src="js/FlashTag.js"></script>
<script type="text/javascript" src="js/FlashSerializer.js"></script>
<script type="text/javascript" src="js/FlashProxy.js"></script>
<script type="text/javascript">
var uid = new Date().getTime();
var flashProxy = new FlashProxy(uid, 'js/JavaScriptFlashGateway.swf');
var tag = new FlashTag('world.swf?data_file=data.xml, 600, 325);
tag.setFlashvars('lcId='+uid);
tag.write(document);
</script>
//flashProxy.call works here:
<p>Zoom Out
Get new data
<p>getZoom | getCoords</p>
<script type="text/javascript">
// Start the refreshing process
var seconds = 3;
var zoom;
var coords;
//timer loop
function checkmap()
{
//flashProxy doesn't work here
flashProxy.call('getCoords');
flashProxy.call('getZoom');
alert (coords);
alert (zoom);
setTimeout('checkmap()',seconds * 1000);
}
checkmap();
//Returns results here:
function gotCoords(n)
{
coords = n;
}
function gotZoom(n)
{
zoom = n;
}
</script>
To clarify, I am trying to get the flashProxy.call('****') to work in the checkmap() function. Thanks in advance.

I found the problem... it was that because there was no timer to start the inital flashproxy.call it was executing before the flash was loaded. I just replaced
checkmap();
with another
setTimeout('checkmap()',seconds * 1000);
Thanks everyone anyway

Did you know you have an extra/unclosed script tag in your source? This would cause problems.
<script type="text/javascript"> // This is your opening tag
<script type="text/javascript"> // Oops, this is parsed by the script engine
var uid = new Date().getTime();
var flashProxy = new FlashProxy(uid, 'js/JavaScriptFlashGateway.swf');
var tag = new FlashTag('world.swf?data_file=data.xml, 600, 325);
tag.setFlashvars('lcId='+uid);
tag.write(document);
</script>
The above code would throw a syntax error in any javascript engine and halt further execution.
Your source is also missing a ' on the following line:
var tag = new FlashTag('world.swf?data_file=data.xml, 600, 325);

Related

how to call one file input id into another file using javascript

im having 2 html files, in my first file i have declared a variable and i want to use the same variable in my second file...
my first file code is
<script type="text/javascript">
function topics(clicked_id)
{
var ids = clicked_id;
var myObject, fol;
myObject = new ActiveXObject("Scripting.FileSystemObject");
if(!myObject.FolderExists("D:/JavaScript/Work/Days/"+ids))
{
fol = myObject.CreateFolder("D:/JavaScript/Work/Days/"+ids);
}
load_page();
}
function load_page()
{
open("file:///D:/JavaScript/Work/Topics_Page.html");
}
</script>
i want to use "ids" variable in my second file...
Thanks;
If the HTML documents have the same origin you can use postMessage, MessageChannel, SharedWorker or storage event to communicate between different browsing contexts, see
How can I load a shared web worker with a user-script?
Can we refer to JavaScript variables across webpages in a browser session?
how to pass data from one html page to second in php?
You can use localStorage and storage event to use the same object variable, or define a local variable set to the value of localStorage at a different HTML documenta having the same domain.
<!DOCTYPE html>
<html>
<head>
<title>index</title>
</head>
<body>
otherPage.html
<h1>set id</h1>
<script>
let id;
let h1 = document.querySelector("h1");
h1.onclick = e => {
id = `${Math.E * Math.PI * Math.random()}`;
localStorage.setItem("id", id);
console.log(`id: ${id} at ${e.type}`);
}
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>other page</title>
<script>
let id = localStorage.getItem("id");
console.log(`id: ${id} at ${document.title}`);
onstorage = e => {
console.log(`id: ${localStorage.getItem("id")} at ${e.type}`);
id = localStorage.getItem("id");
console.log(id);
}
</script>
</head>
<body>
<h1>otherPage.html</h1>
</body>
</html>
plnkr https://plnkr.co/edit/m4RIdwgIl74Dk6YmGAgI?p=preview

javascript html update img src - what's wrong with this? [duplicate]

This question already has answers here:
Refresh image with a new one at the same url
(23 answers)
Closed 8 years ago.
The code works the first time and the recursive call works but the image does not update. NOTE: The .src does not change - it is just updated in the camera a couple times a second so if I refresh the page it updates but not through the recursive function call - what do I need to do to get it to update? Thanks!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Image update from cam</title>
<script type="text/javascript">
var t;
function updateimg() {
document.getElementById('camimg').src = "urlofimgfromcamera - this is valid url";
t = setTimeout('updateimg()', 2000);
}
</script>
</head>
<body>
<img id="camimg" src="" width="1400" alt=""/>
<script type="text/javascript">
t = setTimeout('updateimg()', 2000);
</script>
</body>
</html>
The image is not updated because it is cached by your browser and you are using the same URL. Try to add a date to your image URL and you should use setInterval instead of recursive calls:
var timer = setInterval(function(){
var imgUrl = "image.png?v=" + new Date().getTime();
document.getElementById('camimg').src = imgUrl
},5000);
As #adeneo pointed, do not pass strings to the setTimeout function, you can even get rid of the parenthesis.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Image update from cam</title>
<script type="text/javascript">
var t;
function updateimg() {
document.getElementById('camimg').src = "urlofimgfromcamera - this is valid url";
t = setTimeout(updateimg, 2000);
}
</script>
</head>
<body>
<img id="camimg" src="" width="1400" alt=""/>
<script type="text/javascript">
t = setTimeout(updateimg, 2000);
</script>
</body>
</html>

cannot change content of div - Uncaught TypeError: Cannot set property 'innerHTML' of null

I would like to change the contents of a div, using javascript and innerHTML.
I cannot get it to work. I just added the code for changing the div, before that the code was working fine. I double checked the syntax.
I'm using webshims, openlayers and jquery/javascript
In the in the console I see
Uncaught TypeError: Cannot set property 'innerHTML' of null
imagegaledit - myFile.php :768
so.onmessage - myFile.php :324
768 is that line
document.getElementById("imgedtitle").innerHTML=mnmi[0];
and 324 is this
imagegaledit(0);
Little help?
Thanks
edit
websockets work and responce fine
Here is the code (concise and simplified)
<!doctype html>
<header>
<meta charset="utf-8">
<meta http-equiv="content-type" content="text/html">
<script src="jquery-1.8.2.min.js"></script>
<script src="js-webshim/minified/extras/modernizr-custom.js"></script>
<script src="js-webshim/minified/polyfiller.js"></script>
<script>
$.webshims.polyfill();
</script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<!--open layers api library-->
<script type='text/javascript' src='OpenLayers.js'></script>
<script type='text/javascript'>
//openlayers vars and stuff here...
function init(){
//when a point on map clicked...
function selected_feature(event){
//some openlayers magic...
var so = new WebSocket("ws://localhost:8000");
so.onerror=function (evt)
{response.textContent = evt;}
so.onopen = function(){
response.textContent = "opened";
so.send(JSON.stringify({command:'map',fmid:jas}));
}
so.onmessage = function (evt) {
var received_msg = evt.data;
var packet = JSON.parse(received_msg);
//pass data to var and arrays...
imagegaledit(0);
}
}//closes function selected_feature
}//closes init
function imagegaledit (w){
if (w==0){
document.getElementById("imgedtitle").innerHTML=mnmi[0];
}
}//closes imagegaledit
</script>
<body onload='init();'>
Title</br><div id="imgedtitle"> </div> </br>
</body>
You need a closing script tag:
</script>
<body>

String.format not a function

I'm using HTML publisher in hope to have a html page with some javascript codes running on hudson. The HTML code is like this:
<html>
<head>
<!--Load the AJAX API-->
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../stringformat.js"></script>
<script type="text/javascript">
......
sql=String.format("/.csv? select from table where exchange=`ABC......")
</script>
</head>
However, after a successful build, my html page doesn't show what it suppose to, and as I check the error console, it says
Error: TypeError: String.format is not a function
I have put my stringformat.js into the top folder, as the HTML publisher doesn't seem to allow the file to contain anything other than HTML files.
Can anyone tell me why the String.format is not loaded properly? Thanks!
PS: stringformat.js is the file i got from
http://www.masterdata.se/r/string_format_for_javascript/
The code should be working properly as this piece of code works outside the hudson
try code:
<html>
<head>
<title>String format javascript</title>
<script type="text/javascript">
String.format = function() {
var s = arguments[0];
for (var i = 0; i < arguments.length - 1; i++) {
var reg = new RegExp("\\{" + i + "\\}", "gm");
s = s.replace(reg, arguments[i + 1]);
}
return s;
}
var _myString = String.format("hi {0}, i'am {1}","everybody", "stackoverflower");
function show(){
alert(_myString);
}
</script>
</head>
<body>
<input type="button" name="btnTest" id="btnTest" value="Test string format" onclick="show();" />
</body>
</html>

Load and parse xml based on string, IE

Im trying to parse an xml string in IE based on the following example: http://dean.edwards.name/weblog/2006/04/easy-xml/
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$(function(){
var xml = document.createElement("xml");
xml.src = '<test><node1>Test</node1></test>';
document.body.appendChild(xml);
var xmlDocument = xml.XMLDocument;
document.body.removeChild(xml);
});
</script>
</head>
<body>
</body>
</html>
Fiddle
However, its not working. I get no errors, but nothing is happening.
Is there any way to generate an XML file on the client side in IE based on a valid xml string? Is activeX the only option?
Thanks in advance
A variant I have working is not to create an xml object, but create a wrapper div instead:
<script type="text/javascript">
$(function(){
var div, xmlDocument;
div = document.createElement('div');
div.innerHTML = '<xml><test><node1>Test</node1></test></xml>';
document.body.appendChild(div);
xmlDocument = div.firstChild.XMLDocument;
document.body.removeChild(div);
});
</script>
ActiveX is certainly one option. The code would be something like:
var xml = '<test><node1>Test</node1></test>';
var xmlDoc = new window.ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.loadXML(xml);
alert(xmlDoc.documentElement.nodeName);

Categories

Resources