javascript - For a Google Wave Gadget, is there a defined point at which it's ok to modify UI? -

I want to keep two gadgets separate from my gadget: when it has just been added, then enter some information to the user To do, and, once he is done with that, another who shows some data based on that information.

First of all I can decide on what to do from the two scenes, when I get the state for the first time in the State Call, i.e. when I change the UI there, however, It does not always show - apparently there are some time-related problems involved. Sometimes the UI does not appear at all, sometimes it looks fine, sometimes it appears in front of the animation loading the gadget.

Here is a simple test case:

   & Lt; / ModulePrefs & gt; & Lt; Content type = "html" & gt; & Lt ;! [CDATA [& lt; Script type = "text / javascript" & gt; Function vsform () {document.write ("
 ");} & lt; / script> & lt; script type =" text / javascript "> function stateUpdated () {createForm ();} Function init () {if (wave & wave.isInWaveContainer ()) {wave.setStateCallback (stateUpdated);}} Gadgets.util.regist ErOnLoadHandler (init); & lt; / script & gt;]] & gt; & lt; / content & gt; & lt; / module & gt;  

< Div class = "post-text" itemprop = "text">

  & script; script type = "text / javascript" & gt; function vs.form () {document.write ("& lt; Div id = \ "form \" & gt; "); Document.write (" user name: & lt; input type = text value = \ "whatever \" id = \ "user_name \" & gt; ") ; Document.write ("& lt; Input Type = Button Value = \" Go! \ "OnClick = \" fetchFromUsername () \ "& gt; & lt; br & gt;); Document.write ("NSID: & lt; input type = text value = \" 287312604 @ N00 \ "id = \" user_id \ "& gt;"); Document.write ("& lt; input type = button value = \" go! \ "OnClick = \" fetchFromNSID () \ "& gt; & lt; br & gt;"); Document.write ("Number of photos: & lt; input type = text value = \" 3 \ "id = \" per_page \ "& gt;"); Document.write ("& lt; / div>"); } & Lt; / Script & gt;  

As you can see in the document, write

: Write a string of text in the document stream opened by the open (). Note that the function will produce a document that is not inspired by any DTD and hence an invalid result may occur in the context of the document.

So it is not good to use such method, I recommend you use a framework, such as jQuery, which can create and add elements in a DOM-friendly manner You can. This would be an task method.