IAF / Simpele opmaak in mail

Simpele opmaak in mail

Binnen XperienCentral is het mogelijk om na het invullen van een formulier een mail te sturen met de waardes die de gebruiker bij het formulier ingevuld heeft. Als je dit al eens hebt gedaan, heb je mogelijk gemerkt dat de opmaak van een e-mail erg eenvoudig is. Dit artikel toont hoe je je simpele mail met een kleine workaround toch professioneel kunt over laten komen.

Voorkennis

Let wel: In dit artikel ga ik niet in op hoe je waardes toevoegt aan een mail en hoe je de betreffende variabelen kunt vinden, dit staat allemaal beschreven in de online help van XperienCentral onder Application tools > Interactive Forms > Scripting in Forms. Voor dit artikel is dus enige kennis van het gebruik van variabelen in een mail handler nodig. 

Vereisten:

• Een formulier met daarin elementen die in te vullen zijn. In dit artikel maak ik gebruik van een tekst veld, een e-mail veld en een radiobutton selectie veld in combinatie met nog een tekst veld.
• Een mail handler die ingesteld is op het formulier. Dit kan de mail handler "meertalig" of "een taal" zijn. De "pagina" mail handler wordt gebruikt om een HTML mail te versturen en valt dus buiten de scope van dit artikel.

Wenselijke situatie:

We willen de mail zodanig vormgeven dat de ingevulde tekst in een nette lijn achter de beschrijving van de waarde komt te staan. Zie hieronder voor een voorbeeld:

Oplossing:

Om het bovenstaande te bewerkstelligen kun je in de body van de e-mail handler een variabele aanmaken binnen javascript tags. 

$
 var mail ="";
$

Bij deze variabele kun je vervolgens op de normale manier de waardes toevoegen:

$
 mail = mail + "Naam:" + step1.naam.value;
 mail = mail + "Email:" + step1.email.value;
 if (step1.bent_u_lid.value == 'ja'){
  mail = mail + 'Lidmaatschapsnummer:'+step1.lidmaatschapnummer.value;
 }
$

Echter, deze waardes zullen nu direct achter de beschrijving van de waarde te komen staan. Dit kun je simpel oplossen door de code voor een tab in een javascript variabele toe te voegen: "\t". Het resultaat wordt dan het volgende:

$
 var mail='';
 mail = mail + "Naam:\t\t\t\t" + step1.naam.value;
 mail = mail + "Email:\t\t\t\t" + step1.email.value;
 if (step1.bent_u_lid.value == 'ja'){
  mail = mail + 'Lidmaatschapsnummer:\t'+step1.lidmaatschapnummer.value;
 }
$

Wat opvalt aan bovenstaand stukje code is dat er bij de eerste twee waardes 4 tabs staan, terwijl dit bij de laatste maar 1 is. Dit komt omdat "lidmaatschapnummer" langer is en dus minder tabs nodig heeft. De juiste afstemming verdient enige "trial and error".

Voordat de mail verstuurd kan worden dien je nog twee aanpassingen te maken. Allereerst moeten de waardes op een nieuwe regel terecht komen. In javascript doe je dit door "\n" toe te voegen. Ook zal binnen dit stukje Javascript ook de waarde terug gegeven moeten worden, zodat de informatie in de mail komt te staan. Het volledige script ziet er dan als volgt uit.

$
 var mail='';
 mail = mail + "Naam:\t\t\t\t" + step1.naam.value;
 mail = mail + "\nEmail:\t\t\t\t" + step1.email.value;
 if (step1.bent_u_lid.value == 'ja'){
  mail = mail + '\nLidmaatschapsnummer:\t'+step1.lidmaatschapnummer.value;
 }
 mail;
$

Als een persoon het formulier invult, dan zal het er als volgt uit komen te zien:

Op deze manier kun je dus een nette mail opstellen.