Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Die Konfiguration ohne Collections

Die ComboBox:

Code Block
languagexml
<ComboBox Id="Land">
  <Item Label="Schweiz" Value="Schweiz" />
  <Item Label="Deutschland" Value="Deutschland" />
  <Item Label="Österreich" Value="Österreich" />
</ComboBox>

...

Navigationsschalter ausserhalb von Rows

Code Block
languagexml
<Button TargetView="SecondView" Label="Weiter" IsDefault="true" />
<Button Type="Submit" Label="OK" />
<Button Type="Cancel" Label="Abbrechen" />

...

1b) Zugriff auf das ComboBox-Element in der View

Code Block
languagexml
<Row>
  <Label Content="Bitte wählen" />
  <ComboBox Id="DocParam.Zeichen" ColumnSpan="2" IsInvalidWhenValue="0" />
</Row>

...

TextNode in der DataNode-Section:

Code Block
languagexml
<Text Id="DocParam.RBGeschlecht">1</Text>

In der View:

Code Block
languagexml
<Row>
  <Label Content="Geschlecht" />
  <RadioButton Id="DocParam.RBGeschlecht" Value="1" Label="Frau" />
  <RadioButton Id="DocParam.RBGeschlecht" Value="2" Label="Mann" />
</Row>

...

Code Block
<DataNodes>
  <ComboBox Id="DocParam.RBGeschlecht" SelectedValue="2">
    <ListItem Value="1"  DisplayText="Frau" />
    <ListItem Value="2"  DisplayText="Mann" />
  </ComboBox>
</DataNodes>

In der View:

Code Block
languagexml
<Row>
  <Label Content="Geschlecht" />
  <RadioButton Id="DocParam.RBGender" Value="1" Label="Frau" />
  <RadioButton Id="DocParam.RBGender" Value="2" Label="Mann" />
</Row>

...

IsVisible-Bind:

Code Block
languagexml
<Row>
  <Label Content="IsVisible" />
  <TextBox Id="DocParam.OutputSubtract" ColumnSpan="3" Bind="IsVisible: Calc('$('DocParam.Field1') - $('DocParam.Field2')';'C2') == 'CHF 20.00'" />
</Row>
<Row>  
  <Label Content="IsVisible" />
  <TextBox Id="DocParam.OutputSubtract" ColumnSpan="3" Bind="IsVisible: Calc('$('DocParam.Field1') - $('DocParam.Field2')';'') == '20.00'" />
</Row>  

Weiter bietet Calc die Möglichkeit, angewählte CheckBoxen zu "zählen":

Code Block
languagexml
<Row Bind="IsVisible: Calc('$('Checkbox1') + $('Checkbox2') + $('Checkbox3') + $('Checkbox4')';'F0') == '2'">
  <Label Content="Label">
</Row>

...

Das Script-Element wird an folgender Stelle eingefügt:

Code Block
languagexml
<Configuration>
  <CustomContentSection [...]>
    <DataNodes>
      [...]
    </DataNodes>
  </CustomContentSection>
  <Views>
    <Script>
      <![CDATA[
        // Hier kann JavaScript geschrieben werden.
      ]]>
    </Script>
    <View>
      [...]
    </View>
  </Views>
</Configuration>

...

Komplettes Beispiel, das die Möglichkeiten der JavaScript-Integration aufzeigt:

Code Block
languagexml
<?xml version="1.0" encoding="utf-8"?>
<Configuration>
  <CustomContentSection Name="Dokument-Parameter" WindowWidth="750" WindowHeight="450">
    <DataNodes>
      
      <Text Id="DocParam.TextFieldMustContainTest">Etwas</Text>
      
      <Text Id="DocParam.TextFieldInput">Zwölf Boxkämpfer jagen Viktor quer über den großen Sylter Deich.</Text>
      <Text Id="DocParam.TextFieldResultUpperCase" />
      <Text Id="DocParam.TextFieldResultLowerCase" />
      
    </DataNodes>
  </CustomContentSection>
  <Views OnSubmit="validate()">
    <Script>
      <![CDATA[
        
        function validate() {
          var textFieldContainsTest = OO.getValue("DocParam.TextFieldMustContainTest") === "Test";
          
          if (textFieldContainsTest === false) {
            OO.addValidationMessage("DocParam.TextFieldMustContainTest", "Textfeld 1 muss 'Test' sein und nicht '" + OO.getValue("DocParam.TextFieldMustContainTest") + "'");
            return false;
          }
           
          return true;
        }
        
        function textFieldInputChanged() {
          var textOfTextField = OO.getValue("DocParam.TextFieldInput");
          
          var textInUpperCase = textOfTextField.toUpperCase();
          OO.setValue("DocParam.TextFieldResultUpperCase", textInUpperCase);
          
          var textInLowerCase = textOfTextField.toLowerCase();
          OO.setValue("DocParam.TextFieldResultLowerCase", textInLowerCase);
        }
        
      ]]>
    </Script>
    <View Id="main" Label="Startseite">
      <Row>
        <TextBlock Style="h1" ColumnSpan="4">JavaScript-Beispiel</TextBlock>
      </Row>
      <Row>
        <Separator ColumnSpan="4"/>
      </Row>
      <Row>
        <Label Content="Muss &quot;Text&quot; enthalten" />
        <TextBox Id="DocParam.TextFieldMustContainTest" ColumnSpan="3" />
      </Row>
      <Row>
        <Separator ColumnSpan="4"/>
      </Row>
      <Row>
        <Label Content="Eingabe" />
        <TextBox Id="DocParam.TextFieldInput" ColumnSpan="3" OnChange="textFieldInputChanged()" />
      </Row>
      <Row>
        <Label Content="Ausgabe in Grossbuchstaben" />
        <TextBox Id="DocParam.TextFieldResultUpperCase" ColumnSpan="3" IsEnabled="false" />
      </Row>
      <Row>
        <Label Content="Ausgabe in Kleinbuchstaben" />
        <TextBox Id="DocParam.TextFieldResultLowerCase" ColumnSpan="3" IsEnabled="false" />
      </Row>
      <Button Type="Submit" Label="OK" IsDefault="true" />
      <Button Type="Cancel" Label="Abbrechen" />
    </View>
  </Views>  
</Configuration>

...

Der dazugehörige Dialog:

...

Validierung:

Code Block
languagexml
<Configuration>
  <CustomContentSection Name="Dokument-Parameter" WindowWidth="750" WindowHeight="750">
    <DataNodes>   
      
      <Text Id="DocParam.Subject" Required="true" ValidationMessage="Bitte geben sie einen Betreff ein" />
      <Text Id="DocParam.4NumbersMax" Regex="^[0-9]{1,4}$" ValidationMessage="Die Zahl darf maximal aus vier Ziffern bestehen und muss natürlich sein" />
      
    </DataNodes>
  </CustomContentSection>
  <Views>
    <View Id="main" Label="Startseite">
      <Row>
        <TextBlock Style="h1" ColumnSpan="4">Titel</TextBlock>
      </Row>
      <Row>
        <Separator ColumnSpan="4"/>
      </Row>
      <Row>
        <Label Content="Betreff" />
        <TextBox Id="DocParam.Subject" ColumnSpan="3" />
      </Row>
       <Row>
        <Label Content="Maximal Vierstellige, natürlich Zahl" />
        <TextBox Id="DocParam.4NumbersMax" ColumnSpan="3" />
      </Row>
      <Button Type="Submit" Label="OK" IsDefault="true" />
      <Button Type="Cancel" Label="Abbrechen" />
    </View>
  </Views>
</Configuration>

...

Das Verhalten des Dialoges:

...

Bindings: Calc

Code Block
languagexml
<Configuration>
  <CustomContentSection Name="Dokument-Parameter" WindowWidth="750" WindowHeight="750">
    <DataNodes>
      
      <!-- Eingabefelder für die mathematischen Funktionen mit validen Standardwerten -->
      <Text Id="DocParam.Field1">1</Text>
      <Text Id="DocParam.Field2">1</Text>
      
      <Text Id="DocParam.TestNode2" />
      <Text Id="DocParam.OutputAdd" />
      <Text Id="DocParam.OutputSubtract" />
      <Text Id="DocParam.OutputDivide" />
      <Text Id="DocParam.OutputMultiply" />
      <Text Id="DocParam.CB1" />
      <Text Id="DocParam.CB2" />
      <Text Id="DocParam.CB3" />
      <Text Id="DocParam.CB4" />
        
    </DataNodes>
  </CustomContentSection>
  <Views>
    <View Id="main" Label="Startseite">      
      <Row>
        <TextBlock Style="h1" ColumnSpan="4">Titel</TextBlock>
      </Row>
      <Row>
        <Separator ColumnSpan="4"/>
      </Row>
      <Row>
        <Label Content="Wert 1" />
        <TextBox Id="DocParam.Field1" ColumnSpan="3"/>
      </Row>
      <Row>
        <Label Content="Wert 2" />
        <TextBox Id="DocParam.Field2" ColumnSpan="3" />
      </Row>    
      <Row Bind="IsVisible: Calc('$('DocParam.Field1') + $('DocParam.Field2') &gt; 1000';'F0') ">
        <TextBlock>Wert1 + Wert2 Ergeben mehr als 1000</TextBlock>
      </Row>
      <Row>
        <Label Content="Ergebnis Addition" />
        <!-- Simples CalcBinding mit Addition und Formatierung auf zwei Nachkomastellen im Währungsformat -->
        <TextBox Id="DocParam.OutputAdd" ColumnSpan="3" Bind="Value: Calc('$('DocParam.Field1') + $('DocParam.Field2')';'C2')" />
      </Row>
      <Row>
        <Label Content="Ergebnis Subtraktion" />
         <!-- Simples CalcBinding mit Subtraktion und Formatierung auf zwei Nachkomastellen im Währungsformat -->
        <TextBox Id="DocParam.OutputSubtract" ColumnSpan="3" Bind="Value: Calc('$('DocParam.Field1') - $('DocParam.Field2')';'C2')" />
      </Row>
      <Row>
        <Label Content="Ergebnis Division" />
         <!-- Simples CalcBinding mit Divison und Formatierung auf drei Nachkomastellen im Dezimalformat -->
        <TextBox Id="DocParam.OutputDivide" ColumnSpan="3" Bind="Value: Calc('$('DocParam.Field1') / $('DocParam.Field2')';'F3')" />
      </Row>
      <Row>
        <Label Content="Ergebnis Multiplikation" />
         <!-- Simples CalcBinding mit Multiplikation und Formatierung auf zwei Nachkomastellen im Währungsformat -->
        <TextBox Id="DocParam.Outputmultiply" ColumnSpan="3" Bind="Value: Calc('$('DocParam.Field1') * $('DocParam.Field2')';'C2')" />
      </Row>     
      <Row>
        <CheckBox Id="DocParam.CB1" Label="CB1"></CheckBox>  
        <CheckBox Id="DocParam.CB2" Label="CB2"></CheckBox>
        <CheckBox Id="DocParam.CB3" Label="CB3"></CheckBox> 
        <CheckBox Id="DocParam.CB4" Label="CB4"></CheckBox>     
      </Row>  
      <!-- Calc Binding um angewählte Checkboxen zu "zählen" -->
      <Row Bind="IsVisible: Calc('$('DocParam.CB1') + $('DocParam.CB2') + $('DocParam.CB3') + $('DocParam.CB4')';'F0') == '1'">
        <Label Content="Eine Checkbox angewählt"></Label>
      </Row>       
      <Row Bind="IsVisible: Calc('$('DocParam.CB1') + $('DocParam.CB2') + $('DocParam.CB3') + $('DocParam.CB4')';'F0') == '2'">
        <Label Content="Zwei Checkboxen angewählt"></Label>
      </Row>      
      <Row Bind="IsVisible: Calc('$('DocParam.CB1') + $('DocParam.CB2') + $('DocParam.CB3') + $('DocParam.CB4')';'F0') == 3">
        <Label Content="Drei Checkboxen angewählt"></Label>
      </Row>       
      <Row Bind="IsVisible: Calc('$('DocParam.CB1') + $('DocParam.CB2') + $('DocParam.CB3') + $('DocParam.CB4')';'F0') == 4">
        <Label Content="Vier Checkboxen angewählt"></Label>
      </Row>     
      <Button Type="Submit" Label="OK" IsDefault="true" />
      <Button Type="Cancel" Label="Abbrechen" />
    </View>
  </Views>  
</Configuration>

...