Handbuch | Tutorial | Standardbibliothek | Release Notes

Handbuch

Version 4.7.2

45.1.6

installCustomWebResolver - Baum und TreeTable

Für das Mappen von Bäumen ist es notwendig sowohl die Hauptkomponente selbst, also diejenige, die alle Einträge enthält, wie auch die einzelnen Baumknoten zu mappen. Zusätzlich müssen Sie auch den Baumknoten Öffnen bzw. Schließen-Button mappen.

Klasse	Notwendige Komponenten / Unterelemente
Tree	Stellt den Baum dar, beinhaltet die Einträge.
TreeNode	Stellt einen Baumknoten dar.
Expander:TreeNodeExpander	Stellt den Baumknoten Öffnen bzw. Schließen Button dar.
	Optionale Unterelemente
Spacer:TreeNodeSpacer	(Optional) Wird verwendet um die Einrückung auf die richtige Ebene zu bewerkstelligen.
CheckBox:TreeNodeCheckBox	(Optional) Stellt eine CheckBox unter einem Baumknoten dar.
Icon:TreeNodeIcon	(Optional) Stellt ein Icon unter einem Baumknoten dar.

Tabelle 45.2: Mapping von Bäumen

Im Falle einer TreeTable können Sie hier statt Tree jeweils TreeTable anwenden: Also TreeTable anstatt Tree, TreeTableNode anstatt TreeNode, Expander:TreeTableNodeExpander anstatt Expander:TreeNodeExpander etc.

Beispiel:

Im Demo für den WebCarConfigurator befindet sich ein Baum. Um diesen zu öffnen gehen Sie über das Menü »Einstellungen«-»Sondermodelle...«, wählen ein Modell und klicken dann auf den Button "Details". Sie finden die dazugehörige Testsuite unter qftest-4.7.2/demo/carconfigWeb/carconfigWeb_de.qft

Wenn Sie sich die aufgenommenen css-Klassen in QF-Test ansehen oder die Seite mit einem beim Browser mitgelieferten Entwicklerwerkzeug analysieren (siehe Abschnitt 45.1.2) werden Sie folgende HTML-Struktur finden (etwas vereinfacht und gekürzt):

<table id="DetailsTree" class="tree">
  <tbody>
    <tr class="treenode even">
      <td>Information</td>
      <td></td>
    </tr>
    <tr class="treenode odd>
      <td>
        <span>
          <span class=treenodespacer">&nbsp;&nbsp;</span>
          <span class="treetoggler">
            <img src="include/collapse.png" onclick="javascript: ..."></img>
          </span>
          <span>Zubehör</span>
        </span>
      </td>
    </tr>
    <tr class="treenode odd>
      <td>
        <span>
          <span class=treenodespacer">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            </span>
          <span>Zentralverriegelung</span>
        </span>
      </td>
    </tr>
  </tbody>
</table>

Beispiel 45.2: HTML Tree

Wenn Sie dann im Testfallsatz "Fahrzeug anlegen mit CustomWebResolver" im ersten Testfall und dort wiederum im ersten Testschritt den Prozeduraufruf von qfs.web.ajax.installCustomWebResolver ansehen,

Abbildung 45.5: WebCarConfigurator

sind dort unter anderem folgende Zuweisungen für das Mappen des Baums enthalten:


`installCustomWebResolver`
Zuweisungen für einen Baum aus der QF-Test Beispieltestsuite.
Parameter
`resolver`	custom
`version`
`genericClasses`	tree=Tree, treenode=TreeNode, treetoggler=Expander:TreeNodeExpander, treenodespacer=Spacer:TreeNodeSpacer