Admin Forum:AJAX cleans away JavaScript?

This Forum has been archived

Wikia's forums are a place for the community to help other members. To contact staff directly or to report bugs, please use Special:Contact.

Note: This topic has been unedited for 878 days. It is considered archived - the discussion is over. Do not add to unless it really needs a response.

Hello! I'm an admin on Locomotive Wiki and I have a question concerning the use of AJAX and JavaScript at the same time.

A little while ago I asked here for help with adding a tag to URLs (admins' user pages) for use in the recent changes. Rappy gave me some cool jQuery, something along the lines of this if memory serves me correctly (personal test):

$('[href="/wiki/User:Example"],').attr('title', 'This user is an administrator');

I've now modified this text (with some help from others), to run better and include more admins. The problem now (though I have known about it for awhile) is that the AJAX refresher deletes the tags upon activation. Is there a way of getting around this problem? I did good job of appending "[admin]" to the links in question in my personal js (if I do say so myself), but I wasn't thinking since that being javascript as well: the ajax deleted it with the tags. As before any help with this problem? :) STARFLEETACADEMY 01:26, May 12, 2012 (UTC)

The technical reason why they disappear is because javascript (and thus jQuery) apply only to the elements on the page at the time. Ajax refresh gets the new list of recent changes and puts it in place of the elements in the body of the page - thus, it overwrites the changes made by your JS. ajaxcallagain is an array of functions that are run every time ajaxrc refreshes the page. So by adding your function to that array, it will re-apply all of your changes to the new elements on the page. Monchoman45TalkContribsSkystone 01:40,5/12/2012

You don't want a string containing the function name, just the actual function name. Functions are objects in javascript, so you can use them like they're variables. Monchoman45TalkContribsSkystone 03:17,5/12/2012

Try ajaxCallAgain = [AdminTag,FounderTag]; (with the quotes in there, they are just strings, not function references) — Mathmagician 03:36, May 12, 2012 (UTC)

Sigh, that didn't work either Mathmagician. It completely breaks the script. To the point where the text doesn't highlight and the ajax refresher doesn't display. To contain this here a bit more... here's the import:

/* Any JavaScript here will be loaded for all users on every page load. */
// Ajax auto-refresh
var ajaxPages = ['Special:RecentChanges','Special:WikiActivity'];
var AjaxRCRefreshText = 'Auto-refresh';
/* You can remove this comment
* this calls FounderTag() and AdminTag()
* after every time the ajax reloads */
ajaxCallAgain = [FounderTag,AdminTag];
importScriptPage('AjaxRC/code.js', 'dev');
// END of ajax auto-refresh
/* You can remove this comment
* these next two lines will call FounderTag()
* and AdminTag() only once, after the page
* finishes loading */
$(FounderTag());
$(AdminTag());
function FounderTag() {
$('[href="/wiki/User:HenryDuckFan"]').attr('title', 'This user is the Founder');
}
function AdminTag() {
$('[href="/wiki/User:Starfleet_Academy"], [href="/wiki/User:SirHandelFalcon"], [href="/wiki/User:Kpt_kraut_99"]').attr('title', 'This user is an Administrator');
}

You can see it working on my test wiki if you like, just go here and hover over my name, the title should say "This user is the Founder" both with/without the ajaxRC — Mathmagician 04:11, May 12, 2012 (UTC)

I apologize for causing so much trouble, but I'm afraid it hasn't worked again Math. Any suggestions? I copied it, didn't touch placement, code or anything. Still won't work. Is this a slow server issue again, or what? I couldn't see it working on your wiki either. :/ STARFLEETACADEMY 07:00, May 12, 2012 (UTC)

You might want to declare your functions before you add them to ajaxCallAgain:

function FounderTag(){
$('[href="/wiki/User:HenryDuckFan"]').attr('title','This user is the Founder');}function AdminTag(){
$('[href="/wiki/User:Starfleet_Academy"], [href="/wiki/User:SirHandelFalcon"], [href="/wiki/User:Kpt_kraut_99"]').attr('title','This user is an Administrator');}/* Any JavaScript here will be loaded for all users on every page load. */// Ajax auto-refreshvar ajaxPages =['Special:RecentChanges','Special:WikiActivity'];var AjaxRCRefreshText ='Auto-refresh';/* You can remove this comment
* this calls FounderTag() and AdminTag()
* after every time the ajax reloads */
ajaxCallAgain =[FounderTag,AdminTag];
importScriptPage('AjaxRC/code.js','dev');// END of ajax auto-refresh/* You can remove this comment
* these next two lines will call FounderTag()
* and AdminTag() only once, after the page
* finishes loading */
$(FounderTag);
$(AdminTag);

And on a related note: It's $(FounderTag); not $(FounderTag());. You don't want to invoke the function and pass its result to $(), but pass the function itself to $(). -- pecoes 07:27, May 12, 2012 (UTC)

Pecoes is correct on both counts. However, I believe the root of the problem is a Firefox compatibility issue with the .attr() method. The code I gave you works in Chrome. In fact, it was working for me on your wiki! But then when you posted back here, I checked in Firefox 12 and noticed it wasn't working.

Pecoes, can you do a favor for me? Go here (in Oasis with Firefox, preferably logged out) and purge the page -- when it loads, watch the siderail carefully. What happens for me with Firefox 12 is that the script runs, making my name 40px and changing the title attribute properly, but then after 1-2 seconds, it magically defaults back to the original size and the title is reset to null! It's really weird. — Mathmagician 07:48, May 12, 2012 (UTC)

I couldn't try it logged-out because I seem to have misplaced the USB-stick with my password database *rolleyes* but at least while logged-in your code seems to work fine. -- pecoes 07:56, May 12, 2012 (UTC)

(edit conflict) But no sweat.

@Pecoes: It works! :D It works fine. I will cross browser check, but it works in FF 12.

@Math: Nooooooo! I forgot to test it in other browsers. I am using Fire Fox 12, and it didn't work for me too. Sorry. The .attr thing is fine now as well -- of course. :D STARFLEETACADEMY 08:02, May 12, 2012 (UTC)

(Reset indent) So it's working fine now? Hmmmm. Weird. (On my test wiki in Firefox 12 while logged out, I can still reproduce that weird issue I mentioned above 100% of the time -- but it doesn't occur while logged in, or with Chrome) — Mathmagician 08:21, May 12, 2012 (UTC)

Okay, I've tested it in IE 9, Safari 5.1, Chrome 18 and obviously Fire Fox 12. It's all ship-shape. I'll be able to add this to many more logs now. So thank you all! :D

@Math: Could it be some code on your wiki? :) STARFLEETACADEMY 08:25, May 12, 2012 (UTC)

Now I have got the bit between my teeth. I tried that, and it works fine for me in FF 12, logged in or out. Any thoughts? STARFLEETACADEMY 08:33, May 12, 2012 (UTC)

If no one else can reproduce it, it must be something on my end. I've already tried turning off / uninstalling all my extensions and that didn't fix it. But in any case, it's obvious that your code works, so I wouldn't worry about it. (Although I personally would like to know what's wrong with my Firefox) — Mathmagician 08:38, May 12, 2012 (UTC)

When you view pages as an anon - and that's true with any browser - they're served from a different cache. The cache for the web-at-large is significantly more aggressive i.e. it takes hours before it updates. Maybe that's what bit you... -- pecoes 08:44, May 12, 2012 (UTC)

Even though I've deleted my entire browsing history and sent ?action=purge to the server a dozen times? — Mathmagician 08:56, May 12, 2012 (UTC)

(edit conflict) (Reset indent) @Math: If you haven't made any changes to the "Web-developer" section of FF, then you should worry less about your Moz version. I don't know why the servers would treat you and me differently though. I don't think resending the purge command will help. If I was you I'd leave this code on your wiki (or use Locomotive Wiki's) and check tomorrow. If it's working tomorrow, then maybe a S:C might be in order, but if it's still not working: Uninstall Fire Fox and download a new version. Not ideal, but I can't see another option, unless you can? :\

So it's been ~18 hours, I've purged my cache and used ?action=purge in the URL too many times to count. Completely uninstalled Firefox, shut down my computer, reset my internet connection, got a fresh install of Firefox 12 and I'm still getting this issue. But only while logged out. XD — Mathmagician 01:31, May 13, 2012 (UTC)

When you say it doesn't work: Are there any error messages? And can you confirm the script loads to begin with? You can test both with Firebug. To test the latter type the name of one of the script's functions or variables into the console and see if it's accessible. -- pecoes 05:30, May 13, 2012 (UTC)

There's no error messages in Firebug. And I can run the script from the console just fine by typing in AdminTag() and it works then. — Mathmagician 06:18, May 13, 2012 (UTC)

Okay. So the script does get loaded. It just doesn't run or doesn't work for some reason. Try adding some console.logs to the script - especially to AdminTag - and see what if anything gets executed. -- pecoes 06:28, May 13, 2012 (UTC)

Oh joy. The Facebook crap. This stuff also breaks the TabView extension - at least for me. Have you tested if the AjaxRC code works? And if so, does ajaxCallAgain still have a value? -- pecoes 08:12, May 13, 2012 (UTC)