This is my first question on this site. I have an issue with Internet explorer. My contact form works fine in Chrome, Safari and FF but not in IE. Here is the link for my form.
Basically the problem(s) are that there is no text in the dropdown select and as a consequence, nobody can send an enquiry via IE. Can someone help me out here?
Other information...
I got the fancy contact form from:
http://tutorialzine.com/2009/09/fancy-contact-form/
There are other smaller issues such as width of the selects are different in various browsers but I only care about the above problem.
Many thanks
There are a couple errors in the code. I would suggest using a javascript debugger. Chrome developer tools has a good one, and
Firebug is good too for Firefox
for Chrome:
Control - Shift - I keys to open Developer Tools
Control - Shift - J to open Developer Tools and bring focus to the Console.
Control - Shift - C to toggle Inspect Element mode
In your code there are missing commas and parenthesis for if statements... though those are not needed by the compiler, it's good practice to always wrap if statements inside commas, and always put semicolon at the end of each row.
For example
$("#contact-form").validationEngine({
inlineValidation: false,
promptPosition: "centerRight",
success : function(){use_ajax=true},
failure : function(){use_ajax=false;}
}) // missing semicolon here
and
{
$.validationEngine.buildPrompt(".jqTransformSelectWrapper","* This field is required","error") // missing semicolon here
return false;
}
Since you are having bad arguments call in the debugger, it's better to write the code the right way, then we can try to understand what's wrong.
Related
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.
I'm working on a website where one of the pages has a list of articles and an option to filter these based on certain keywords. All the keywords are links and listed to the right of the list. In order to get the correct URL's, the links on each keywords hold part of the ajaxURL that would give the correct response for the given keyword. In addition, I got a script that adds a 'click'-event to all links and appends the last required parameters to the ajaxURL. I "reload" the list by using jQuery's 'load'-function, like this:
$('a.keyword').click(function(event){
event.preventDefault();
// Other logic
$('.list').load(ajaxURL);
}
However, when using the filter in IE9 the content of 'ajaxURL' is loaded into the entire page. That is, the entire page is replaced with the resulting list. I figured this could be a problem of only using 'event.preventDefault()' on the 'click'-event I got on each link, so I added a variety of alternatives:
event.stopPropagtion()
return false
if(event.preventDefault){
event.preventDefault();
} else {
event.returnValue = false;
}
After hours of debugging, trying different combinations of these and trying IE7, IE8 and IE9 using the developer tool provided in IE, I realized that the first time I open the page with IE9 (without opening the developer tool), I get the problem described above. However, when I open the developer tool and selects IE8 it all works perfectly! The same happens when I change it back to IE9! (In this case I used all the alternatives above.)
For some reason, these transitions make it work! I can't figure out how to fix this.. I can't force users to open developer tool and switch mode to make i work. :P Any ideas? Does the developer tool add something that could do this?
I appreciate any help on the matter! :-)
PS. It works just fine in Chrome, ++.
The only thing I can think of is having console.log() in your script. That statement throws a Javascript error in IE up until you open the Developer Tools.
If that occurs earlier than the code you provided in the question then the rest of your script probably won't get evaluated, and your event handlers won't be bound at all, causing the links to just be regular links.
I am trying to rearrange the table rows in the preformatted HTML table.The HTML table is being displayed as in the below fiddle.. My total HTML is given in this fiddle.
Initial Look of the table
I am trying to rearrange the <td> with texts containing texts "One" and "Two".I am identifying those "One" and "Two" rows using "rowspan" attribute. If you see the below fiddle in non IE browser you can have a clear picture on what i am trying to do..
After rearranging
But the problem is, This Code is working fine in browsers other than IE(I have tested in Chrome and Firefox). I am unable to find where the problem is...
Please help me to correct my code to have cross browser compatibility.
Thanks for your answers, I found the problem.. IE is assigning the index from 1 to the elements. So giving
find('td.mrGridCategoryText:eq(0)')
is giving undesired results, If i change it to 1 then i am getting correct result in IE but not in others.Check this fiddle http://jsfiddle.net/J7WPb/23/
So
i need to give eq(0) if other browsers and eq(1) if IE :-(
Thanks again.
If you can, use IE9 (Windows 7+ only) and press "F12" for the console and debugging abilities.
You can then even use the javascript debugger to refresh the page and have it break on javascript errors
Personally, I don't support IE, not till they start supporting the "internet" the way every other "way better browser" does
UPDATE
I found a problem! When IE8 loads the page there is an error on line 195 of file LayoutCM.js
In other words, I don't think the error is in your code as much as it is a jFiddle issue!
Suffice it to say, IE8 doesn't support "getStyle" on the object it's being called upon (variable "win" expected as "window").
This is just another shining example of IE not supporting the "internet" as I put it earlier.
Hope this information helps!
We have this fun example of how our EcmaScript/JavaScript Obfuscator works.
We provide links that show the unobfuscated and obfuscated Ecmascript source for a
"dynamic clock". When you press the start button you will see that the clock graphic parts follow your mouse movements and when you stop moving the mouse it forms a ticking circular clock.
See here ...
http://www.semdesigns.com/Products/Obfuscators/ECMAScriptObfuscationExample.html
The issue that both the un-obfuscated and obfuscated code works fine with Internet Explorer but not with FireFox. So what is the difference between EcmaScript for FireFox and Internet Explorer that results in this code working with Internet Explorer but not with FireFox is the question? I have tried this several versions of FireFox including the latest version and all fail.
First place to check is the "Error Console" or your Firebug console - finding it depends on your version of Firefox and whether or not you have Firebug installed.
I immediately found this in the console when trying out your page:
Error: document.getElementById("mzSeconds" + i) is null
Source File: http://www.semdesigns.com/Products/Obfuscators/UnobfuscatedJavaScriptMouseClock.js.txt
Line: 19
Update
Having found the error, and with Dexter and jfriend00 having pointed out why you're getting the error in the first place, we can see that the difference between IE and "all other" browsers in this case is not how they execute EcmaScript, but in how they construct the DOM in the face of HTML errors -- missing closing quotes on attributes in your case. (Though there are script differences those are not relevant here)
Your document.write() would output <div id="mzSeconds0 style="position:..."> which is invalid, leading to another debugging tool: validation.
If CSS rules or Javascript code behave strangely or inconsistently across browsers it's a good idea to validate your HTML (at validator.w3.org) because invalid HTML will be parsed in different ways by different browsers.
Your immediate problem is that you are generating invalid HTML code, appending it to the DOM, and then trying to find it again using document.getElementById.
The offending section is line 100 of UnobfuscatedHTMLPage.html, which contains this line:
document.write('<div id="'+(('mzSeconds'))+i+' style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');
You're missing the closing " immediately after id="'+(('mzSeconds'))+i+', which causes the id of the div tag to be processed incorrectly in IE (two wrongs making a right, in this case).
There are a number of similar errors in that section of code - you'll need to fix them all (by debugging your code in Firebug or Chrome Developer tools) before your code will be valid and work in non-IE browsers.
A very simple look in the debug console of any browser that it doesn't work in would show you where the error was (I used Chrome). Then, a look at the DOM would show you why that error occurred. Use your debugging tools to find your problems.
I think the root issue is that when you generate your HTML, you are missing some closing quotes. That creates illegal HTML which different browsers barf on differently.
The first error in your code is triggered because no object with id="mzSeconds0" exists. This is caused because you are missing a closing double quote in this line:
document.write('<div id="'+(('mzSeconds'))+i+' style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');
It should be this with the closing double quote at the end of id="mzSeconds0":
document.write('<div id="'+(('mzSeconds'))+i+'" style="position:absolute;top:0px;left:0px" width="15" height="15"><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</b></center></font></div>');
I think the same error exists on most of these types of lines and you will need to fix them all.
Checking a debugger yields: document.getElementById("mzSeconds" + i) is null and also includes line numbers and stack trace which should make fixing your bug easy.
The cause is that you are throwing invalid HTML to the browser which need to try to correct it somehow. Obviously you end up having a different DOM in IE an Firefox.
document.write('<div id="'+(('mzMinutes'))+i+' style="position:absol…
I still don't see the use of obfuscating JavaScript or writing code in your style. Write HTML directly instead of misusing JavaScript to do so. When you need to create content from JavaScript, then use DOM functions instead of document.write. This would have saved you from this bug.
When you are running your code to a debugger (Firebug), you'll find other bug popping up. Please do also have a look at JavaScript strict mode because it would probably save you a lot of time by pointing out bad practices.
I get an error message from Firefox "Unresponsive script". This error is due to some javascript I added to my page.
I was wondering if the unresponsiveness are caused exclusively by code loops (function calling each other cyclically or endless "for loops") or there might be other causes ?
Could you help me to debug these kind of errors ?
thanks
One way to avoid this is to wrap your poor performant piece of code with a timeout like this:
setTimeout(function() {
// <YOUR TIME CONSUMING OPERATION GOES HERE>
}, 0);
This is not a bullet proof solution, but it can solve the issue in some cases.
According to the Mozzila Knoledgebase:
When JavaScript code runs for longer than a predefined amount of time, Firefox will display a dialog that says Warning: Unresponsive Script. This time is given by the settings dom.max_script_run_time and dom.max_chrome_script_run_time. Increasing the values of those settings will cause the warning to appear less often, but will defeat the purpose: to inform you of a problem with an extension or web site so you can stop the runaway script.
Furthermore:
Finding the source of the problem
To determine what script is running too long, click the Stop Script button on the warning dialog, then go to Tools | Error Console. The most recent errors in the Error Console should identify the script causing the problem.
Checking the error console should make it pretty obvious what part of your javascript is causing the issue. From there, either remove the offending piece of code or change it in such a way that it won't be as resource intensive.
EDIT: As mentioned in the comments to the author of the topic, Firebug is highly recommended for debugging problems with javascript. Jonathan Snook has a useful video on using breakpoints to debug complex pieces of javascript.
We need to follow these steps to stop script in Firefox.
Step 1
Launch Mozilla Firefox.
Step 2
Click anywhere in the address bar at the top of the Firefox window, to highlight the entire field.
Step 3
Type "about:config" (omit the quotes here and throughout) and press "Enter." A "This might void your warranty!" warning message may come up; if it does, click the "I'll be careful, I promise!" button to open the page that contains all Firefox settings.
Step 4
Click once in the "Search" box at the top of the page and type "dom.max_script_run_time". The setting is located and displayed; it has a default value of 10.
Step 5
Double-click the setting to open the Enter Integer Value window.
Step 6
Type "0" and click "OK" to set the value to zero. Firefox scripts now run indefinitely, and will not throw any script errors.
Step 7
Restart Mozilla Firefox.
Excellent solution in this question: How can I give control back (briefly) to the browser during intensive JavaScript processing?, by using the Async jQuery Plugin. I had a similar problem and solved it by changing my $.each for $.eachAsync
there could be an infinite loop somewhere in the code
start by commenting out codes to identify which section is causing it
too many loops: there might be a chance that your counter variable name clashes, causing the variable to keep resetting, causing the infinite loop.
try as much as possible to create hashes for your objects so much so that read time is O(1) and in a way caching those data
avoid using js libs as some of the methods might cause overheads. eg. .htm() vs .innerHTML
setTimeout() yes and no -- depends on how you chunkify your codes