CODEWITHSUNDEEP
javascriptjquerygreasemonkey
darkred
darkred

Reputation: 637

Greasemonkey (using the waitForKeyElements utility) - how to call a function after a specific element has been displayed on screen

(In continuance to this question of mine).
I've been writing this userscript for the site metal-archives.com.
When opening a band page (example) you land to DISCOGRAPHY>COMPLETE DISCOGRAPHY.
My script applies to that DISCOGRAPHY tab
and it's sub-tabs (COMPLETE DISCOGRAPHY, MAIN, LIVES, DEMOS, MISC) :
it splits the column "Reviews" in two and makes the table sortable.

I want initially (using the waitForKeyElements utility in my script in greasemonkey)
a function (which adds a column to the table, based on it's contents, appendColumn(x) )
to be called after the table inside DISCOGRAPHY > COMPLETE DISCOGRAPHY has been completely displayed (I think this as: after the last header of the table has been displayed).
The id value of the last header of that table (MISC.) is already stored in this array position: myArray[end]


So, my failed tries so far (based on this answer that user Brock Adams kindly suggested in my initial question) are variants of: 

function appendColumn(x){....}

function triggerCall(jNode) {   
       appendColumn(0);    or --> jNode.appendColumn(0);   
   }

waitForKeyElements (myArray[end], triggerCall);  // no parentheses after triggerCall

Upvotes: 1

Views: 1763

Answers (1)

Brock Adams
Brock Adams

Reputation: 93493

Assuming the appendColumn function works, as is, on reloads; then you would rewrite it slightly and call it from waitForKeyElements().

You don't need most of that rigamorole, just use class names display and discog for the selector. Like so:

waitForKeyElements (".display.discog", appendColumn);

function appendColumn(jNode) {
    var tbl = jNode[0]; // table reference
    var i;
    var newCell, newText;    

    var tr = tbl.tHead.children[0],
    th = document.createElement('th');
    // THE REST OF THE FUNCTION IS THE SAME...
    //...

Upvotes: 1

Related Questions