State Machine Workflow mit InfoPath Formularen für SharePoint 2010 – Teil 5

Teil 5: InfoPath Formulare erstellen

 Diesen Blog-Post als PDF herunterladen

   Formulare herunterladen
 

Nachdem wir im letzten Teil den Workflows mit Code versehen haben, fehlen jetzt eigentlich nur noch Formulare für die Abarbeitung der einzelnen Aufgaben in den beiden Zuständen statApprover und stateReviewer. Wir brauchen also 2 Formulare. Die generelle Vorgehensweise für die Erstellung von InfoPath Formularen für Workflows ist dabei wie folgt:
 

1. Microsoft InfoPath Designer 2010 aufrufen
2. Neues leeres Formular erstellen
3. Felder definieren
4. Design erstellen und Felder einfügen
5. Definition einer externen Datenquelle zur Kommunikation mit dem Workflow
6. Schaltflächen mit Logik füllen
7. Veröffentlichen des Formular auf einen Netzwerklaufwerk

Neues leeres Formular erstellen

Zunächst müssen wir also erst mal Microsoft InfoPath Designer 2010 aufrufen. Für unser Beispiel wählen wir ein leeres Formular und klicken dann auf Design Form:

 
Wir speichern als nächstes zuerst das Formular unter dem Namen Approver.xsn. 

Generelle Formular Optionen einstellen

Als nächstes stellen wir grundlegende Einstellungen ein. Diese sind im Reiter File (Datei) -> Form Options zu finden:

 
Unter Security müssen wir mindestens den Level Domain einstellen. Es ginge auch Full Trust. In diesem Fall müsste man das Formular mit einem gültigen Zertifikat signieren. Das schenke ich mir der Einfachheit halber in diesem Beispiel. Domain ist auch vollkommen ausreichend:

Bevor wir auf OK klicken, sollten wir die Kategorie Compatibility auswählen und sicherstellen, dass unser Formular als Web Browser Form definiert ist. Wir können hier auch noch eine URL angeben, auf der das Formular beim Hochladen geprüft werden kann, ob es läuft bzw. ob dieses kompatibel mit den Forms Services von SharePoint 2010 ist. Da wir im Verlauf dieses Teils alles richtig machen werden, schenke ich mir diese Eingabe ;-)

 
Nun können wir auf OK klicken und haben das Formular grundelegend konfiguriert.

Felder erstellen

Als nächstes definieren wir erst mal die Felder, die wir brauchen. In unserem Fall benötigen wir die 3 Textfelder:

instructions: Enthält die Anweisungen für den Genehmiger
comment: Kommentar
status: Definiert den Status des Workflows (ok oder nok)

Diese Felder können per Rechtsklick auf die Datenverbindung und Auswahl von Add… angelegt werden:


Danach kann man die Daten des Feldes eintragen:
 

Es genügt in unserem Fall wenn wir mit Textfeldern arbeiten. In gleicher Weise verfährt man jetzt mit den anderen Feldern, so dass unsere primäre Datenquelle wie folgt aussieht:

 
Jetzt wenden wir uns dem Design des eigentlichen Formulars zu.

Design erstellen und Felder einfügen

Als erstes kann man im Reiter Page Design ein Page Layout Template auswählen. In unserem Fall nehmen wir Title and Heading

 
Man kann nun einen Titel und einen Untertitel eintragen. Ich verwende folgendes:

 
Dann lässt sich noch ein Farbschema im Reiter Page Design wählen. Ich verwende ein Industrial Design:

 
Mehr brauchen wir erst mal an dieser Stelle nicht. Wer sich hier noch weiter verkünsteln will, kann dies natürlich tun. Man kann z.B. die Hintergrundfarbe anpassen über die Eigenschaften (Properties im Reiter Page Design). Schriftgrößen und –farben lassen sich im Reiter Home wie von Word her gewohnt anpassen.
Jetzt brauchen wir die Felder, die der Genehmiger ausfüllen soll. Das geht ganz einfach durch Drag&Drop eines Feldes in den Bereich des Formulars. Das erste Feld sind die Anweisungen für den Genehmiger (instructions):

 
Als nächstes passen wir den Text oberhalb des Feldes an und ziehen das Feld noch etwas größer:

 
Das gleiche machen wir mit dem Kommentarfeld (comment) . Zusätzlich brauchen wir 2 Schaltflächen für die Genehmigung bzw. Ablehnung. Die Schaltflächen findet man im Reiter Home im Abschnitt Controls.
Die beiden Schaltflächen platzieren wir mit etwas Abstand unterhalb des Kommentarfeldes. Unser Formular sieht nun etwa so aus:

 
Die Namen der Schaltflächen brauchen jetzt noch eine vernünftige Bezeichnung. Dies kann sehr einfach erreichen durch Klick auf die jeweilige Schaltfläche und Auswahl des Reiters Properties. Dort sieht man die Eigenschaften und kann sie ändern.

 
Wir setzen also die Eigenschaft Label auf Genehmigen und für die andere Schaltfläche auf Ablehnen.
Eine Sache fehlt jedoch noch bevor wir weitergehen: Das Anweisungsfeld sollte natürlich vom Genehmiger nur gelesen werden können, sollte jedoch für ihn nicht editierbar sein. Im Feld Kommentar kann er eintragen, was er lustig ist. Durch einen Rechtsklick Anweisungsfeld (instructions) kann man dieses in ein sog. Calculated Field (Berechnetes Feld) umwandeln. Damit ist es nur noch lesbar:

 
Wir müssen es danach wieder etwas größer ziehen. Übrigens kann man in den Eigenschaften eines Feldes auch die Größe (z.B. Höhe) eines Feldes festlegen und somit eine einheitlichere Darstellung erreichen. In unserem Fall verwende ich eine Höhe von 90 Pixeln. Zusätzlich ändere ich noch die Hintergrundfarbe unseres Feldes. Dies kann man im Reiter Home anhand der Farbfüll-Tools erreichen:

 
Zusätzlich ziehe ich den unteren Bereich noch etwas kleiner und entferne ggf. Leerzeilen.
Damit steht unser Formular für den Genehmiger vom Design her.
Wenn man sehen will wie sein Formular später aussehen wird, kann man sich dieses in einer Vorschau (Preview) ansehen. Dazu wählt man den Reiter Home aus und ganz rechts im Ribbon befindet sich die Schaltfläche Preview:

 
Danach sieht man das Formular in der Vorschau:

 

Definition einer externen Datenquelle zur Kommunikation mit dem Workflow

Als nächstes brauchen wir noch eine weitere Datenquelle, die in der Lage ist, Daten vom Workflow zu lesen. Über diese Datenquelle werden beispielsweise die Anweisungen (instructions) und die Kommentare (comment) transportiert. In einem späteren Teil werden wir sehen, dass diese Daten anhand der Extended Properties aus dem Workflow übergeben werden können. Das Formular liest sie wie gesagt anhand einer Datenquelle ein. Diese müssen wir anhand einer XML-Datei definieren. In dieser XML-Datei stehen die Felder mit dem internen Namens, den SharePoint verwendet. Wir erstellen also eine XML-Datei mit dem Namen ItemMetadata.XML mit folgendem Inhalt:

<z:row xmlns:z="#RowsetSchema" ows_instructions="" ows_approver="" ows_comment="" />

Das einzige auf das man achten muss, ist dass man dem Namen des Feldes, welches man in den Extended Properties des Workflows angibt, ein ows_ voranstellt. Den kompletten Code werden wir in einem späteren Teil noch sehen. Zum Verständnis vorweg den Code, den man verwenden würde, um einen Text für die Anweisungen (instructions) an das Formular zu übergeben:

TaskProperties_Approver.ExtendedProperties["instructions"] = _instructions;

In der XML-Datei für die Datenquelle, damit dieses von InfoPath engegen genommen werden kann, muss das Attribut ows_instructions definiert sein. Der Name des Feldes innerhalb der Extended Properties spielt dabei keine Rolle. Man hätte dieses auch beispielsweise anweisungen nennen können und in der XML-Datei entsprechend ows_anweisungen.

Um darauf nun aus InfoPath zugreifen zu können, binden wir die XML-Datei als externe Datenquelle ein. Dies geht Dies geht am einfachsten, indem man unterhalb dem Baum mit den Feldern auf Manage Data Connections klickt, oder im Reiter Data den Punkt Data Connections anklickt:

 
Im aufgeblendeten Dialog kann man eine Datenquelle mit Add… hinzufügen. Man wird dann durch die weiteren Schritte geführt. Im ersten Dialog wählt man eine neue Datenquelle für das Empfangen von Daten aus:

 
Mit Next gelangt man zum nächsten Schritt. Dort wählt man XML document als Quelle aus:

 
Mit Next geht es weiter zuim nächsten schritt. Dork kann man die XML-Datei auswählen:

 
Und wieder Next zum nächsten Schritt. Dort lässt sich sowieso nichts einstellen. Eine andere Option bei Browser basierten Formularen würde an dieser Stelle auch keinen Sinn machen:

Nach Klick auf Next kann man im letzten Schritt die Datenquelle benennen. Die Checkbox Automatically retrieve Data, when form is opened sollte aktiviert sein:

 
Mit Finish wird die Datenquelle angelegt und man kann mit Klick auf die Schaltfläche Close den Dialog mit den datenquellen wieder schließen.
Jetzt können wir die gerade angelegte Datenquelle dazu nutzen, um Daten vom Workflow in das Feld Anweisungen (instruction) zu schreiben. Hierzu klicken wir auf das Feld instructions im Formular. Im Reiter Properties kann man die Ribbon Schaltfläche Default Value auswählen:


und ist dann in der Lage einen Wert bzw. den Inhalt aus einem Feld in einer Datenquelle einzutragen durch Klick auf die Funktionsschaltfläche:

 
Im darauf folgenden Dialog wählen wir Insert Field or Group aus:

 
Im nächsten Dialog zur Auswahl des Feldes wechseln wir zunächst auf die ItemMetadata Datenquelle:

 
Und wählen dann das Feld ows_instructions aus:

 
Dann die Dialoge mit OK bestätigen und schon ist der Wert aus unserer sekundären Datenquelle im Feld instructions eingetragen:

 
Nach dem Klick auf OK können wir uns auf die Logik hinter den Schaltflächen konzentrieren.

Schaltflächen mit Logik füllen

Was jetzt noch fehlt sind die Aktionen hinter den Schaltflächen. Die folgenden Aktionen werden beim Klick auf die Schaltfläche Genehmigt ausgeführt:
 

• Feld status auf ok setzen
• Daten an den Host zurücksenden
• Formular schließen

Um das alles zu setzen, klickt man auf die Schaltfläche Genehmigen. Im Reiter Home kann man die Ribbon Schaltfläche Manage Rules anklicken und bekommt dann alle Regeln für diese Schaltfläche angezeigt. Über das Menü New lassen sich dann neue Aktion (Action) anlegen:

 
Für die Aktion kann man dann einen Namen vergeben (z.B. Genehmigen). Durch Aufklappen von Add kann man dann weitere Aktionen definieren. Zuerst wollen wir das Feld status setzen. Wählen also Set a field’s value:

 
Im darauf folgenden Dialog kann man das Feld status auswählen und dieses auf ok setzen:

 
Nach Klick aus OK kann man eine weitere Aktion hinzufügen. In diesem Fall brauchen wir die Aktion Submit data:

 
Um die Daten zurückzuschreiben, brauchen wir erst mal wieder eine Datenverbindung zum Schreiben. Wir wählen also im angezeigten Dialog die Schaltfläche Add aus:

 
Dadurch startet wieder der von weiter oben bereits bekannte Assistent für die Datenverbindungen. Im ersten Schritt wählen wir Submit data:

 
Nach Next wählen wir aus, dass wir die Daten an die Host Anwendung, also SharePoint, senden wollen:

 
Nach Next können wir im angezeigten Dialog die Standardwerte übernehmen:

 
Nun noch ein Klick auf Finish und die Datenverbindung ist eingetragen:

 
Nach Klick auf OK ist auch diese Aktion fertig. Die letzte Aktion, die wir benötigen, ist das Formular zu schließen:

 
Im dann angezeigten Dialog können wir die Werte übernehmen und auf OK klicken:

 
Unsere Regeln und Aktionen für die Schaltfläche Genehmigen sehen damit wie folgt aus:

 
Für die Schaltfläche Ablehnen machen wir genau das gleiche, setzen jedoch das Feld status auf nok. Dort sehen die Aktionen damit wie folgt aus:

 
Damit ist unser Formular erst mal fertig und kann veröffentlicht werden.

Veröffentlichen des Formular auf einen Netzwerklaufwerk

Ich speichere meine unveröffentlichten Formulare in einem Verzeichnis im Projektordner von Visual Studio. Nehme diese Dateien aber nicht ins Projekt mit auf. Ich veröffentliche diese Formulare dann ins Verzeichnis des Workflows (in unserem Fall SMApprovalWorkflow) und nehme sie dann als Dateien ins Projekt auf. Wie das geht zeige ich im nächsten Teil. Hier zunächst die Schritte für die Veröffentlichung des InfoPath Formulars:
Zuerst den Reiter File auswählen, dort auf Publish klicken und dann die Option Network Location auswählen:

 
Dadurch wird wieder ein Assistent gestartet. Im ersten Schritt wählen wir die Stelle, in welche das Formular veröffentlicht werden soll und dessen Namen:

 
Nach Klick auf Next landen wir im 2. Schritt. Dort soll eine Dateifreigabe angegeben werden, von wo aus das Formular geladen werden soll. Dies funktioniert allerdings für ein Workflow Formular von für SharePoint nicht. Deshalb müssen wir dieses Feld komplett leeren, ansonsten bekommen wir später beim Aufruf des Formulars einen Fehler:

 
Beim Klick auf Next fragt dann InfoPath auch prompt nach, ob wir das auch wirklich wollen. Da wir ja wissen was wir tun, können wir getrost auf OK klicken. Im nächsten Schritt werden die gesammelten Informationen nochmal angezeigt und wir können dies bestätigen mit Publish:

 
Danach können wir den Assistenten anhand der Schaltfläche Close schließen. Das wars für das Formular für den Genehmiger. Jetzt fehlt noch das Formular für den Initiator, wenn der Genehmiger das Dokument ablehnt.

Formular zum Überarbeiten

Die gleichen Schritte wie oben beschrieben müssen wir nun noch für das Formular Reviewer machen. Es hat im Gegensatz zum Formular für den Genehmiger lediglich ein Feld (approver) mehr. In diesem Feld erfasst der Benutzer den Benutzernamen des Genehmigers. Das Formular hat somit folgende Felder:

 
Es sieht folgendermaßen aus:

 
In diesem Formular sind alle Felder beschreibbar. Im Feld Kommentare (comment) werden die Daten aus dem Workflow geschrieben. Wir brauchen also auch in diesem Fall die sekundäre Datenquelle:

 
Die Regeln/Aktionen für die Schaltfläche Genehmigung starten sehen wie folgt aus:

 
Und für die Schaltfläche Workflow abbrechen sind die Regeln/Aktionen:

 
Damit sind die Formulare fertig und können im nächsten Teil mit dem Workflow verbunden werden. 
 
 

Kommentar hinterlassen Name: Email: Ihre URL: Kommentare: Sicherheitscode eingeben: