Ninox VCard vcf creation and download / Ninox VCard vcf erstellen und downloaden

22. Februar 2024

Einer meiner Kunden hatte die Anforderung seine alte Access mdb-Datenbank in die Cloud zu migrieren.
Die Wahl fiel auf Ninox eine Low-Code-Plattform. Er benötigte die Möglichkeit einen Adress-Datensatz als VCard (vcf) File zu exportieren um die Datei anschließend z.B. via mail zu versenden. Laut Ninox-Support ist das jedoch nur mit einer API-Anbindung möglich, was glücklicherweise nicht stimmte.

Hier dokumentiere ich wie ich es geschafft habe einen Adress-Datensatz als vcf-file aus Ninox zu exportieren inkl. Ninox-Scripting-Code. Die Ninox-App basiert auf der Vorlage „Kontaktmanagement“.

Step 1) In den „Admin-Modus“ wechseln (Schlüsselsymbol oben rechts) und die Datenbank (hier „Kontaktmanagement“) anklicken. Es erscheint die Auswahlmöglichkeit „Optionen“:

Ninox Optionen Globale-Funktionen

Folgenden Code unter „Globale Funktionen“ hinzufügen.
Danke an Jacques TUR für die zwei Funktionen decToHexa() und chr():

function decToHexa(value : number) do
   var hexa := ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"];
   var u := value % 16;
   var d := floor(value / 16);
   item(hexa, d) + item(hexa, u)
end;
function chr(ascii : number) do
   urlDecode("%" + decToHexa(ascii))
end;
function UmlautReplace(myText : text) do
   myText := replacex(myText, "ö", "g", "oe");
   myText := replacex(myText, "ä", "g", "ae");
   myText := replacex(myText, "ü", "g", "ue");
   myText := replacex(myText, "ß", "g", "ss");
   myText := replacex(myText, "Ö", "g", "Oe");
   myText := replacex(myText, "Ä", "g", "Ae");
   myText := replacex(myText, "Ü", "g", "Ue");
   myText
end

Step 2) Fügen sie in ihrem Formular ein Layout-Feld (Button) ein.
Zur Info, ich unterscheide die Adressen in der Anwendung über die Kontaktart (1=Person / 2=Unternehmen / 4=Hotel)

Ninox VCard Button

Step 3) Bearbeiten sie den Button „VCard“ und fügen sie unter „Erweitert“ in die Zeile „Feld nur anzeigen, wenn“ folgenden Code ein: ninoxApp() = „web“ dies dient dazu den Button nur in der Web-App anzuzeigen da die Funktion zum VCard-Export aktuell nur dort funktioniert und z.B. nicht in der Apple- oder Android-App.

Ninox VCard Button (Code)

Fügen sie in die Zeile „Beim Klicken“ folgenden Code ein (sie müssen natürlich den Code noch auf ihre Datenfelder anpassen!). Umlaute müssen konvertiert werden, siehe hierzu die Funktion UmlautReplace() in den „Gobalen Funktionen“ (siehe oben):

let myFilename := "VCard_" + trim(UmlautReplace(trim('Name 1') + "_" + trim('Name 2'))) + ".vcf";
let myVcard := "";
if Kontaktart = 1 then
	myVcard := "BEGIN:VCARD
VERSION:3.0
N;CHARSET=UTF-8;LANGUAGE=de:" + chr(13) + chr(10) +
		"FN:" Anrede + " " + UmlautReplace('Name 1') + " " + UmlautReplace('Name 2') + " " + UmlautReplace('Name 3') + chr(13) + chr(10) +
		"TITLE:" + UmlautReplace(Funktion) + chr(13) + chr(10) +
		"TEL;CELL;VOICE:" + 'Mobil geschäftlich' + chr(13) + chr(10) +
		"TEL;WORK;VOICE:" + 'AP Telefon 1 gesch.' +	chr(13) + chr(10) +
		"TEL;WORK;VOICE:" + 'Telefon 1 gesch.' + chr(13) + chr(10) +
		"TEL;WORK;VOICE:" + 'AP Telefon 2 gesch.' +	chr(13) + chr(10) +
		"TEL;HOME;VOICE:" + 'AP Telefon privat' + chr(13) + chr(10) +
		"TEL;CELL;VOICE:" + 'AP Mobil privat' + chr(13) + chr(10) +
		"ADR;WORK:;;" +	UmlautReplace(Strasse) + ";" + UmlautReplace(Ort) +	";;" + Plz + ";" + Land_MM + chr(13) + chr(10) +
		"URL;WORK:" + Website + chr(13) + chr(10) +
		"EMAIL;PREF;INTERNET:" + 'E-Mail gesch.' + chr(13) + chr(10) +
		"END:VCARD";
else
	myVcard := "BEGIN:VCARD
VERSION:3.0
N;CHARSET=UTF-8;LANGUAGE=de:" +
		UmlautReplace('Name 2') + ";" +	UmlautReplace('Name 1') + chr(13) +	chr(10) +
		"FN:" +	Anrede + " " + UmlautReplace('Name 1') + " " +	UmlautReplace('Name 2') + " " +	UmlautReplace('Name 3') + chr(13) + chr(10) +
		"ORG:" + UmlautReplace('Name 1') + chr(13) + chr(10) +
		"TITLE:" + UmlautReplace(Funktion) + chr(13) + chr(10) +
		"TEL;CELL;VOICE:" +	'Mobil geschäftlich' + chr(13) + chr(10) +
		"TEL;WORK;VOICE:" + 'Telefon 1 gesch.' + chr(13) + chr(10) +
		"TEL;WORK;VOICE:" + 'Telefon 2 gesch.' + chr(13) + chr(10) +
		"ADR;WORK:;;" + UmlautReplace(Strasse) + ";" + UmlautReplace(Ort) +	";;" + Plz + ";" + Land_MM + chr(13) + chr(10) +
		"URL;WORK:" + Website +	chr(13) + chr(10) +
		"EMAIL;PREF,INTERNET:" + 'E-Mail gesch.' + chr(13) + chr(10) +
		"END:VCARD"
end;
let myURL := do as server
		createTempFile(myVcard, myFilename)
	end;
openURL(myURL);
alert("Die VCF-Datei wurde erstellt und heruntergeladen (siehe Downloads)")

Step 4) Einen Datensatz auswählen und auf den Button „VCard“ klicken. Die VCard wird generiert und sofort heruntergeladen. Es erscheint zusätzlich die Meldung „Die VCF-Datei wurde erstellt und heruntergeladen (siehe Downloads) >> OK„

Viel Erfolg mit der VCard-Export-Funktion und ich würde mich über Feedback freuen!

English version

One of my clients had the requirement to migrate his old Access mdb database to the cloud. The choice was Ninox, a Low-Code platform. He needed the ability to export an address record as a VCard (vcf) file to send the file via email. According to Ninox support, this was only possible with an API connection, which fortunately was not true.

Here, I document how I managed to export an address record as a vcf file from Ninox, including Ninox scripting code. The Ninox app is based on the „Contact Management“ (Kontaktmanagement) template.

Step 1) Switch to „Admin mode“ (key symbol top right) and click on the database (here „Kontaktmanagement“ >> Contact Management). The field „Options“ (Optionen) appears:
Skip this step if you don´t have the german characters „äöüßÄÖÜ“ in your data or rewrite this function if you need to replace any characters in your VCard-Outputfile!

Ninox Optionen Globale-Funktionen

Add the following code under „Global Functions.“ Thanks to Jacques TUR for the two functions decToHexa() and chr():


function decToHexa(value : number) do
   var hexa := &#91;"0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "A", "B", "C", "D", "E", "F"];
   var u := value % 16;
   var d := floor(value / 16);
   item(hexa, d) + item(hexa, u)
end;
function chr(ascii : number) do
   urlDecode("%" + decToHexa(ascii))
end;
function UmlautReplace(myText : text) do
   myText := replacex(myText, "ö", "g", "oe");
   myText := replacex(myText, "ä", "g", "ae");
   myText := replacex(myText, "ü", "g", "ue");
   myText := replacex(myText, "ß", "g", "ss");
   myText := replacex(myText, "Ö", "g", "Oe");
   myText := replacex(myText, "Ä", "g", "Ae");
   myText := replacex(myText, "Ü", "g", "Ue");
   myText
end

Step 2) Add a layout field (Button) to your form. Note that I differentiate addresses in the application using the contact type (Kontaktart) (1=Person / 2=Unternehmen / 4=Hotel)

Ninox VCard Button

Step 3) Edit the „VCard“ button and add the following code under „Advanced“ (Erweitert) in the „Field only visible if“ (Feld nur anzeigen, wenn) ninoxApp() = „web“ – this is to display the button only in the web app, as the VCard export function currently works only in the browser and not in the Apple or Android app.

Ninox VCard Button (Code)

Add the following code under the „On Click“ (Beim Klicken) line (you need to customize the code according to your data fields). If you have „special characters“ like german „äöoßÄÖÜ“ in your data they must be converted, for which you can use the UmlautReplace() function in the „Global Functions“ (see above):

Step 4) Select a record and click on the „VCard“ button. The VCard is generated and immediately downloaded. Additionally, a message appears: „The VCF file has been created and downloaded (see Downloads) >> OK.“

Have fun with the VCard export function, and I would appreciate your feedback!

How to fix it

❦