none of the w3schools ajax examples work in firefox - ajax

None of the ajax examples on the w3schools site seems to work for me in firefox 3.0.19
For example: http://www.w3schools.com/ajax/ajax_database.asp
Any ideas how this should be fixed? I've got the same problem on my site...

You can start fixing it by avoiding w3schools altogether. When I read "for IE6, IE5" in the example source I had a shudder.
As an AJAX beginner it would be easier and simpler if you used jQuery or some other JS library's AJAX facilities. Googling for "jquery ajax tutorial" should give you more than enough to get started.
A final aside: upgrading FF to 3.6 or 4 would also not be a bad idea.

Check whether Javascript is enabled in your "firefox" browser.

Install the Firebug add-on and look in the console.
My guess is that you have something like NoScript installed, or the Web Developer toolbar with Disable JavaScript set to true. I have done this lots of times :)

Related

Start with Firefox addons and iframes

I would like to create my firefox addon. I want to call a javascript that changes the src of the iframes.
I dont know how to build an addon that calls my function on BEFORE PAGE LOAD. Only I got is the main.js. I tried to insert alert('hello'); into it, but nothing happens. Is there any useful tutorial for this?
The best place to start is the Addon SDK documentation:
https://addons.mozilla.org/en-US/developers/docs/sdk/1.4/
In particular there is a getting started tutorial:
https://addons.mozilla.org/en-US/developers/docs/sdk/1.4/dev-guide/addon-development/getting-started.html
While it may not solve your particular problem with controlling iframe urls, it will give you a better idea how the SDK works.
Indeed one the most desirable things is get the DOM loaded. So generally we must wait until page is loaded (DOM).
That's why listener as the following are used so much:
window.addEventListener("load", function(){}, false);
appcontent.addEventListener("DOMContentLoaded", function docLoader(e){}, true);
So just call any function that you build. It will run before any page load.
To work in FF addon development helps a lot always make searches prefixing MDN (Mozilla Developer Network). Besides I recommend you read all this MDN: XUL School Tutorial. It start like this:
XUL School is a comprehensive add-on development tutorial, focusing on
Firefox extension development. It is recommended that you read through
all of it at least once. While Firefox changes rapidly, the content in
this tutorial should be up to date and valid.

Google Translate Breaks Stylesheet in Firefox

I am helping a client with an eCommerce site (runs on ProStores from eBay).
The issue is that the site's base stylesheet is breaking (being disabled) when the page is translated with the Google Translate widget. This only happens in Firefox. Chrome, IE(6-9), Opera and Safari are all fine.
Translate in FF was working prior to some changes we made recently: mostly graphical, some additions to the stylesheet. I had to tip-toe around their templates which were built with tables, outdated code etc. so I am overwhelmed when trying to troubleshoot this.
Here is a link to the site: http://www.myfantasticbags.com
(open in FF and use google translate in the header area to see the issue)
Thanks in advance!
I had the same problem and much frustration with this.
The problem I was having was that it was translating my website's font-resizers - From 'large' to 'grande' etc. which was throwing off the font-resize element and entire site.
Try adding a class="notranslate" to any elements you think may be translating and throwing off your stylesheet.
Hope this helps!
Korey
Add class="skiptranslate" to the head tag.
If you also have a link to a print preview style sheet, so your visitors can see how pages will print, try this: Putting the link to your external stylesheet inside a div with class="notranslate", may not only fix the translation in Firefox but also when flipping back and forth between your print preview and default CSS in all browsers. I know that divs in the head tags are atypical, but I don't see any problem arise from that.

cross browser jquery code to copy to clipboard?

jquery or JavaScript code for copy content of an element to clipboard is very important as far as I think. Because I needed it for my project here and I spend two-three days just for it. I had done with zeroclipboard, but very inconvenient and irritating. I really think in the vast internet universe there must be a cross browser client side code to access clipboard. I hope you will suggest some thing.
I forget to mention it was very difficult for me to link copy to clipboard code to jquery ui dialog button. Please do suggest some thing related to cross browser, jquery ui dialog button. Thanks in advance.
This question is a duplicate of 1539641 - I would be very surprised if SO didn't warn you about this since your titles are very similar.
Anyway, as stated in that earlier post, the jQuery plugin Clipboard no longer works as it does not support Flash 10.
I would suggest you have a look at zeroclipboard. I just tested it and it works fine in the latest vers of IE, FF and Chrome.

How do you handle debugging when using Prototype.js

In a lot of cases when my prototype.js javascript code hits an error, I don't get any error notification, line number, etc. I usually end up tracing through my code with alert statement until I find where it dies. Is there a better way to track down these errors?
Depends on browser, but there are some very good ways of handling errors. If you are using firefox, you can install FireBug and then use:
console.log('like an alert but in the firebug window');
It's alot quicker than pressing ok, then ok, then ok...
http://getfirebug.com/
Firebug also has an amazing JS error debugger, and gives great feedback as to what is wrong with your code. A must have if you ask me!
I already use Firebug ...
Is this case, try Chrome — I find that Firefox fails to notify me of errors in my code that uses Prototype.js, but Chrome is fine. Not that I'm a huge fan of Google over Mozilla.

Firefox Live DOM

Is it possible through a plugin or setting or something to allow Firefox to recognize the live DOM source code?
Basically, firebug or other similar tools can recognize elements on the page which Firefox does not.
I understand with these extensions I have the ability to see such changes made by javascript, but Firefox does not seem to fully recognize them.
I'll try to clarify.
If I load a page and view source (ctrl-U), I see what the server sent to Firefox, and what Firefox ostensibly recognizes as the source code of the page. If in that source code, there is javascript which alters the DOM, and then I hit (ctrl-U) again, the code is not updated.
I am using a testing tool (iMacros firefox plugin) to automate functionality, but it does not recognize the updated DOM because Firefox does not. Firebug and similar tools can recognize these "live" updates. Does that help?
http://www.chapter31.com/2006/12/04/viewing-ajax-generated-source-code/
You can try using the web-developer extension with a view-generated-source option.
I'm still not sure I understand your question, but I think what you're getting at is the Web Developer extension for FireFox, specifically its "View Generated Source" feature.
That will let you see the altered DOM.
Firebug gives u this ability:
for instance check the HTML tab when running a jquery ticker and see the dynamic changes live in the DOM
Usually, when I have weird issues with either the console or the DOM inspector with firebug, I find restarting the browser and validating your code is the way forward.
That said, I'm not really following your question, the document that firebug shows is the same one in the firefox window...?
It looks like the problem is not that you want firefox to show the current DOM when you hit CTRL+U, but that you want some automated testing tool to be able to test your web pages.
Perhaps you should use a testing tool that is suited to the job of testing rich web applications, Selenium, for example, can do this.

Resources