I am trying to select a div node based on its CSS id and change the div text, all with jQuery (2.2.0). My problem is that jQuery selection never happens normally?
- This jQuery select code (below, where I use the $ abbreviated string for 'jquery' fucntion ) is part of the standard ' document ready ' callback function, so that the div with the CSS identifier is “supposedly” guaranteed to be in the DOM by the time callback is called. This js code and its standard JSNI $ wnd syntax are similar to jQuery JSNI GWT from .
- All of these jQuery js are in the built-in GWT JSNI method (GWT 2.7.0).
- My project is the GWTP project (1.5.1).
- All observations are reproduced in different browsers, as well as in Production and Dev modes.
I will explain from this code that I have my own JSNI renderTree () method confirmed, the "document ready" event is fired, and the div with the CSS identifier is in the DOM ...
public native void renderTree()/*-{ $wnd.alert("renderTree"); $wnd.$($doc).ready(function() { $wnd.alert("DOM ready!"); $wnd.$('#gramTree').text("text changed from JSNI jQuery"); }); }-*/;
- I call this renderTree () from the constructor of the GWT View class (and more specifically, this is an extended GWTP ViewWithUiHandlers )
- When the watch page loads, "renderTree" appears in the warning window: this proves that the renderTree () method is called by JSNI when I intend, since the first line of renderTree is $ wnd.alert.
- Right after that, "DOM ready!" pops up in the warning window: this proves that the event "ready for the document" is called and its callback is called. This is because the callback is also registered in the event in the JSNI renderTree () method, and the first line of the callback is $ wnd.alert
So far, 1.-3. everything happens as expected ... But the jQuery $ '# gramTree' selection never happens , since a div with this identifier never has its text change for "text modified from JSNI jQuery" (its text is loaded from UiBinder initially as "text initialized from UiBinder" and remains that way).
- I expected the selection to happen, since it is the second line in the document callback, and 3. proved that the callback was called.
- The div with the #gramTree ID is confident in the DOM because I see it in the browser inspector and I see its source text ("text initialized from UiBinder"). This source text is what you intend to change to "text modified from JSNI jQuery" from the "finished document" callback. Div, its CSS identifier, and its source code are declared in GWT UiBinder for my presentation.
I can manually change the text at this point by manually entering the jQuery line of code in the browser console that does not seem to work from the callback ( $('#gramTree').text("text changed from JSNI jQuery"); ). Similarly, I can also get it to work manually by encoding renderTree () to trigger a button click on the page from the event, and manually clicking that button at that point.
Any ideas what is going wrong here?
Apparently, given the reasonable assumption given in 4.-5., That something does not work with the "document ready" event, or how do I handle it?
Any ideas of things for further verification?
Thanks!
source share