We Keep Coding

Chart is rendered in Chrome, but not in FF and IE

H ey there,
I am developing small web-application based on a lot of PHP and JS code and by chance opened the current index.php in Firefox instead of Chrome (my main dev browser).
I was rather shocked to see that one of my main components, a chart (made with amCharts), was not rendered at all. Strangely enough, the watermark of amCharts is shown...
Now I thought it just a hickup and opened the IE to have another browser for comparison, however, same problem there.
I went back to Chrome and everything is still fine there. This really confused me and made me think that it's a code problem, e.g. an unclosed parenthesis somewhere. So I copy pasted my code into several PHP / JS / HTML validators and none had any hits.
In addition I downloaded the Firebug addon for Firefox hoping to find some kind of error, but there is none to be found.
What I also tried to inserting some "console.log" passages in my code to see whether the code execution stops at some point, no luck either. All log messages are shown with their correct values.
Right now I am kinda at my wits end...
Does anyone have an idea / had a similar problem and knows how to solve this or what causes this or how I could find out what causes this?
Any help you can provide would be greatly appreciated.
best regards,
daZza
EDIT:
I fine-tuned the console.log commands and basically backtraced every single step. I now have found the problem, but don't know the source of it. Basically my whole view of logic in programming is breaking apart now... One and the same command returns a different result in another browser, what the hell?!
Here's are some code snippets from the problem area:
xmlData = xmlHttp.responseXML;
var x=xmlData.getElementsByTagName("row");
xmlRowCount = x.length;
console.log("Rowcount: " + xmlRowCount);
for (i=0;i<xmlRowCount;i++)
{
do something with every row in the source xml file
}
Now the problem is that in Chrome the rowcount is correctly returned as 417. FF returns 0 (I guess IE as well).
How can that be possible? How can a predefined command return different values? I just don't get it...
Edit2: To make the browser test complete, I also downloaded and tested Opera. It works fine there, which makes this whole thing even stranger. What is the difference between IE/FF vs. Chrome/Opera?
PS: Here's two screenshots (Chrome and FF) to visualize the problem:

Can you try to use the below code
var x=xmlData.body.all.tags("row");
or
var x=xmlData.all.tags("row");
Hope it helps.

Uncaught TypeError ONLY in Chrome

I#ve a very strange problem calling a simple function in JavaScript.
Just for example, even a simple:
click
or:
click
gives me an Uncaught TypeError: object is not a function.
But ONLY in Chrome and ONLY on my Notebook. On my Workstation (same system, exactly same Chrome Version) and in every single other browser this line works as expected.
Im Working with JS since a few years, but this error drives me nuts since days.
The Website comes with scriptaculous and some handwritten JS, but nothing really special.
scriptaculous works well, JS-Console shows no errors except the one #Chrome on my Notebook.
Anyone of you ever had this before?
I#ve really no idea whats going on.

My suggestion is to assign it via javascript and not like an inline attribute. Sometimes you get odd behaviour setting it as an attribute.
You could use jQuery:
jQuery('.myClickableLink').click(function(){ alert(123) })
I think that's a simpler way.

I am betting you have a pop up blocker installed on that machine that hijacks window.alert. Disable the plugins and see if it works correctly. [Normally a pop up blocker does this]

use
window.alert('msg)';
it will work...

Javascript firefox issue

I developed a .htm document with an in-built script for javascript to run a program. In google chrome, the program works fine, but I got a beta test complaint that it didn't work on firefox 14.01 or opera. On testing with firefox 14.01, I can confirm it doesn't work (I assumed opera to be the same). I cannot insist the audience upgrade their browsers, as this is supposed to be widely compatible.
Doing a little tracing of the issue, I installed Firebug, which, on clicking the Javascript button to generate a coordinate the first time, it worked (clearly showing the function is defined and exists), but the second time, Firebug complained that:
"ReferenceError: GenerateCoord is not defined".
This wouldn't be so ironic if it only did this after generating an (encrypted) coordinate (thus calling GenerateCoord that is supposedly 'undefined').
If one looks in the code, one can clearly see that the function GenerateCoord is clearly defined before it is called. I would say firefox has an 'onclick' issue, but then it begs the question why did it work the first time I clicked it (calling GenerateCoord via 'onclick') but not the second?
Reloading the file allows the button to work the first time, and the first time only. I am baffled as to how firefox can call a function one time that it then says is undefined the next. Am I missing something here?
Javascript and HTML code can be viewed here:
http://pastebin.com/4qykTfEW
-
How do I solve the problem, and is there an easier solution than re-writing the code to avoid onclick (that seems to work in certain circumstances but not others)?

The problem is that using document.write overwrites the entire HTML page, thus inadvertently removing the GenerateCoord script. I'd suggest appending the link to the document (in ShowTarget) rather than attempting to re-write it.
For example, have a container element where the link should be:
<div id="links_container"></div>
Then to append the links, use:
document.getElementById('links_container').innerHTML = Link;

Why can I sometimes not type into my <input> in IE?

I'm having an issue where, periodically, I am unable to type into any input/textareas on Internet Explorer. I'm working primarily with IE9 at the moment.
When I click on an input, the JS click handler (which empties placeholder text) runs, and the active css is applied. However, the cursor does not appear and I can't type. If I tab to an input field, and start typing, everything starts working again.
I have a fair bit of JS running, but no errors running. I suspected TinyMCE had something to do with it, but it also happens when there are no editors on the page, so that doesn't seem to be it either. If you don't have an answer, I'd love an idea of what could be happening here that I could look into more, since I'm a bit stumped.

I eventually solved this. It was a strange and nasty issue with TinyMCE, where TinyMCE was being destroyed while the cursor was inside the main window. Fix was to explicitly focus out before it gets destroyed.

I had a similar issue once with I.E. where I was using .split to make sure the input box was not empty when gaining focus. However, I.E. did not support .split and would crash my js. I had to write my own and it ended up working out. Not sure if this in any way applies to what you are doing, but I thought I would just throw it out there.

Since you have lots of javascript on the page, a likely reason would be either a naming conflict or even more likely a js crash. Traverse your code for the 200th time.

Has Chrome browser broken dynamic script loading?

This isn't my code, I'm just troubleshooting it. Some code that has been working for over a year has now stopped working in Chrome (12.0.742.122), but works in the other "big" browsers (including fellow WebKit stablemate Safari (5.0.5)). By "not working anymore" I mean that although the script file does load, it doesn't execute. The kind of behaviour you'd expect if loading a script into innerHTML or writing it into a div, but neither of which things are being done. The commented-out lines below were all failed attempts at getting it working, the first of those being the original code that had worked up until recently.
<div id="abc"></div>
<script type="text/javascript">
var d=document.getElementById("abc");
var s=document.createElement('SCRIPT');
if(s){s.src=script_path;}
//if(d)d.appendChild(s); //original line that still works in all other browsers
//if(d)d.parentNode.appendChild(s);
//if(d)d.parentNode.insertBefore(s,d);
//if(d)d.parentNode.insertBefore(s,d.nextSibling);
document.body.appendChild(s); //this works, script executes
</script>
What is wanted from this code above, is that the script is a child of the div. Presumably they want to be able to remove that child and have all script be removed at the same time (I'm not sure of their motivation).

I've discovered what the problem was, largely thanks to Martin Bieder's back and forth and introducing me to jsfiddle.net with his working example.
The issue was actually the test page and what you'd think would be a fairly harmless error they made in creating it. The div and all of the code will be represented below simply as ######, as it's not even relevant to the problem. It's actually a HTML problem. Chrome 12 isn't happy if you don't match up your closing tags properly. I really can't believe that it has an effect on the execution on script files, but it does. I've tried many many times in the last 10 minutes with the HTML tags right and wrong and unbelievably this really is the problem.
<font><center><b>
##########
</b></font></center>
You see how the font and center closing tags are the wrong way around, and that's enough to confuse Chrome sufficiently that it won't execute any dynamic script being added within those tags. Bizarre. I can't recreate this on jsfiddle, probably due to the nature of the site runs the html/js that you put onto it (using onload for example).

No it works. Google Analytics uses is, too.
var ga=document.createElement('script');
ga.type='text/javascript';
ga.async=true;
ga.src='http://www.google-analytics.com/ga.js';
var s=document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(ga,s);

Have you tried to set to async the script element?
var script = document.createElement('script');
script.async = 'async';

It is all about 3 things.. Organization, Optimization, and debugging.
1)properly scoping your tags makes things easier to read.
2)properly organizing your code makes it easier to parse which means parsers can be faster and more efficient.
3)alot of the debug tools we use rely on this organization in order to display things like collapsible tags and present a more visual scoping