Databases
StackOverflow2013
Postsdbo
POUnderstanding Document.createElement()
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POUnderstanding Document.createElement()
    primarykey
    data
    text
    <p>I'm using <code>GWT</code> and its underlaying <code>DOM</code> capabilities.</p> <p>What I'm basically trying to achieve is : </p> <ul> <li>Have a <code>div</code> element holding some text</li> <li>Some of these text would be surrounded by <code>span</code> elements</li> <li>The span elements are draggable into each other and offers contextual menus</li> <li>New <code>span</code> elements can be created dynamically by the end-users</li> </ul> <p><strong><em>This is what it could look like :</em></strong> </p> <p><img src="https://i.stack.imgur.com/2BJf9.png" alt="This is what it could look like"></p> <p>At the startup of the application, and during end-users dynamic creation of <code>spans</code>, I have to do some <code>Element</code> and <code>Nodes</code> manipulations (creating, inserting, modifying, deleting). To achieve this, I have to go through the DOM tree to be able to find particular elements.</p> <p>I'm looking for ways to reduce useless time spent at the <strong>startup of the application</strong>, where I build my <code>div</code> element (containing all the text and <code>span</code> elements).</p> <p>Take this example : </p> <pre class="lang-java prettyprint-override"><code>DivElement outermostDiv = Document.get().createDivElement(); processText(outermostDiv, text); // text could be a Java String element turnTheseIntoSpans(listOfSpans, outermostDiv); // listOfSpans could be a list of text that must be surrounded by span elements. </code></pre> <p>Let's imagine, that <code>turnTheseIntoSpans</code> do lots of modifications of the <code>outermostDiv</code> element using methods like : <code>appendChild()</code>, <code>removeFromParent()</code>, ...</p> <p><strong><em>My questions are :</em></strong></p> <ol> <li><p>Is it a good practise to modify <em>outermostDiv</em> and its childs before inserting it into the DOM ?</p></li> <li><p>I can have access to <code>outermostDiv</code> childs, sibling of childs, without having added it to the <code>DOM</code>. I would like to understand how a browsable tree of elements exists even before <code>outermostDiv</code> is added to the DOM ?</p></li> </ol>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USJean-Michel Garcia
    1. USJean-Michel Garcia
    plurals
    1. This table or related slice is empty.
    1. PL
      singulars
      1. LTLinked
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    2. PO
      singulars
      1. PTAnswer
    3. PO
      singulars
      1. PTAnswer
    1. VO
      singulars
      1. POUnderstanding Document.createElement()
      1. This table or related slice is empty.
      1. VTUpMod
    2. VO
      singulars
      1. POUnderstanding Document.createElement()
      1. This table or related slice is empty.
      1. VTUpMod
    1. CODoes it have to be a span element? It would help if you explain why you cannot do it in a traditional GWT way (add widgets/elements to the panel, manipulate them as much as you need to, and then attach the panel).
      singulars
      1. POUnderstanding Document.createElement()
      1. USAndrei Volgin
    2. CO@AndreiVolgin question edited.
      singulars
      1. POUnderstanding Document.createElement()
      1. USJean-Michel Garcia
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload