Joomla 5 Notice

We are pleased to announce that as of January 29, 2024, all of our Joomla extensions are compatible with Joomla 5.

For all who are still updateing from Joomla 3 to Joomla 4: Joomla 4 Migration instructions are available here:

There is now a separate Documentation for Visforms for Joomla 4 and for Visforms for Joomla 5!

Forum

Visforms Subscription user can ask questions in our forum. Please log in with the relevant user first.
Everybody can access the forum for reading.

Please only ask 1 question per topic.

Important information for almost every question:
V1: Which Visforms version is running?
V2: Which Joomla version is running?
V3: Which PHP version is running?

Signaturfeld auf Mobile Geräten

More
11 months 1 week ago #9924 by sestec
Signaturfeld auf Mobile Geräten was created by sestec
Hallo 

Gibt es eine Möglichkeit, wo ich auf den Mobilgeräten das Feld <<Schreiben ermöglichen>> ausschalten kann, aber das Feld <<Schriftzug löschen>> trotzdem eingeblendet wird. Eigentlich wie Desktop Version.

Danke

Freundliche Grüsse
Serkan

More
11 months 1 week ago - 11 months 1 week ago #9928 by Administrator IV
Replied by Administrator IV on topic Signaturfeld auf Mobile Geräten
Hallo Serkan,

du kannst das Verhalten mit etwas eigenem CSS und den Visforms 'Frontend Webassets' lösen.
Frontend Webassets:
docs.joomla-4.visforms.vi-solutions.de/d...-frontend-webassets/
Alle Einstellungen werden im Formular vorgenommen:
docs.joomla-4.visforms.vi-solutions.de/d...formular-vorgenommen

Hier ein Beispiel für ein Formular mit einem Signatur-Feld.

Wenn die Device-Breite größer als 600px ist, wird das Feld <<Schreiben ermöglichen>> angezeigt.
Wenn die Device-Breite kleiner oder gleich 600px ist, wird das Feld <<Schreiben ermöglichen>> versteckt.

Das Formular auf einer breiten Device:
vi-solutions.de/forum-uploads/css-media_form-wide.png

Das Formular auf einer schmalen bzw. mobilen (<=600px) Device:
vi-solutions.de/forum-uploads/css-media_form-narrow.png

Die Formular-Konfiguration:
vi-solutions.de/forum-uploads/css-media_fewa.png

Füge das folgende CSS in der Formular-Konfiguration, Reiter 'Frontend Webassets', dort Reiter 'Formular' in die Option 'CSS' ein.
Drücke anschließend den Knopf 'Speichern' unterhalb des Feldes, um deine Änderungen zu speichern.

Code:
@media only screen and (max-width: 600px) {     .visCanvas {         display: none;     } }

Siehe auch:
www.w3schools.com/css/css_rwd_mediaqueries.asp
und
developer.mozilla.org/en-US/docs/Web/CSS.../Using_media_queries

Liebe Grüße, Ingmar

:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).
Last edit: 11 months 1 week ago by Administrator IV.
The following user(s) said Thank You: sestec

More
11 months 1 week ago #9931 by Administrator IV
Replied by Administrator IV on topic Signaturfeld auf Mobile Geräten
Hallo Serkan,

meine erste Antwort hat sich automatisch auf die Anzeige des Formulars bezogen.
Aber offensichtlich meinst du aber die Daten-Editieren-Ansicht.
Ansonsten macht der Button 'Schreiben ermöglichen' keinen Sinn, da er allein auf der Daten-Editieren-Ansicht erscheint.

Hier also die zweite Antwort, die sich auf die Daten-Editieren-Ansicht bezieht.
Es bleibt alles grundsätzliche gleich.
Es ändert sich nur das CSS etwas und auf dem Reiter 'Frontend Webassets' steht das geänderte CSS nun auf dem Reiter 'Daten-Edit'.

Die Daten-Editieren-Ansicht auf einer breiten Device:
vi-solutions.de/forum-uploads/css-media_edit-form_form-wide.png

Die Daten-Editieren-Ansicht auf einer schmalen (mobilen) Device:
vi-solutions.de/forum-uploads/css-media_...form_form-narrow.png

Die Formular-Konfiguration:
vi-solutions.de/forum-uploads/css-media_edit-form_fewa.png

Füge das folgende CSS in der Formular-Konfiguration, Reiter 'Frontend Webassets', dort Reiter 'Daten-Edit' in die Option 'CSS' ein.
Drücke anschließend den Knopf 'Speichern' unterhalb des Feldes, um deine Änderungen zu speichern.
Code:
@media only screen and (max-width: 600px) {     .vfUnlockC {         display: none !important;     }     .vfSigReset {         display: block !important;     } }

Liebe Grüße, Ingmar

:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).
The following user(s) said Thank You: sestec

More
11 months 1 week ago #9933 by sestec
Replied by sestec on topic Signaturfeld auf Mobile Geräten
Hallo Ingmar

Funktioniert leider beides nicht. 
Bei der 1 .Lösung verschwindet das Signaturfeld, jedoch das <Schreiben ermöglichen> Button bleibt. 
Bei der 2. Lösung, wenn ich es bei Daten-Edit eintrage, ändert sich nichts, aber wenn ich den Code beim Formular Reiter eintrage, dann verschwindet das <Schreiben ermöglichen> Button, aber das Signierfeld ist trotzdem blockiert. 

Liebe Grüsse, Serkan

More
11 months 6 days ago - 11 months 6 days ago #9934 by Administrator IV
Replied by Administrator IV on topic Signaturfeld auf Mobile Geräten
Hallo Serkan,

Lösung 1 war eh hinfällig.

Lösung 2 war tatsächlich von mir nicht zu ende gedacht.
Das Signaturfeld muss selbstverständlich noch aktiviert werden und dass geht nur mit JavaScript.
Und wenn wir JavaScript eh brauchen, dann machen wir gleich alles damit.

In der Formular-Konfiguration, Reiter 'Frontend Webassets', dort Reiter 'Daten-Edit':
- Lösche den Eintrag für die Option 'CSS'.
- Trage den folgenden JavaScript-Code in die Option 'JavaScript'.

Code:
jQuery(document).ready(function() {     // console.log('FEWA edit script loaded');     if (("ontouchstart" in window) || navigator.maxTouchPoints) {         // only on gesture devices (mobile)         jQuery('.visform').bind('visformsInitialised', function() {             // initialize after the form is initialized             enableSignatureField(584);         });     } }); function enableSignatureField(field){     jQuery("#field" + field + "_sig").jSignature("enable");     jQuery("#field" + field + "_sigtools .vfSigReset").show();     jQuery("#field" + field + "_sigtools .vfLockC").hide();     jQuery("#field" + field + "_sigtools .vfUnlockC").hide(); }

Zu '584' aus obigem JavaScript-Code:
Das ist die ID des Signatur-Feldes aus der Feld-Liste, Spalte 'ID'.
Diese musst du an die ID deines Signatur-Feldes anpassen.

Auf einer mobilen Device sieht die Daten-Editieren-Ansicht damit wie folgt aus:
vi-solutions.de/forum-uploads/css-media_...mobile_data-edit.png
Auf einem Desktop hingegen bleibt die Daten-Editieren-Ansicht unverändert.

Achtung:
Wir haben den Mechanismus 'Schreiben ermöglichen/Schriftzug schützen' in der Daten-Editieren-Ansicht aus gutem Grund.
Es soll verhindert werden, dass ein Schriftzug beim Editieren aus Versehen geändert wird.
Gerade auf mobilen Devices ist jedes Wischen über dem Signatur-Feld ein Schreiben.
Ich bin mir nicht sicher, ob du das wirklich so möchtest.

Allgemein:
Du sprichst ausschließlich vom "Formular" und unterscheidest allein zwischen Desktop und Mobil.
Das ist zumindest sehr irreführend.

Zu unterscheiden sind zuallererst die Formular-Ansicht (erstmaliges Abschicken von Daten) und die Daten-Editieren-Ansicht (Editieren von gespeicherten Daten).
Allein in der Daten-Editieren-Ansicht haben wir den Mechanismus 'Schreiben ermöglichen/Schriftzug schützen' und der ist identisch für Desktop und Smartphone.

Daher auch die verschiedenen Reiter unterhalb des Reiters 'Frontend Webassets' in 'Formular' und 'Daten-Edit' und andere.
Wenn du etwas unter 'Formular' einträgst, wird es nur für die Formular-Anzeige geladen.
Wenn du etwas unter 'Daten-Edit' einträgst, wird es nur für die Daten-Editieren-Ansicht geladen.

Wenn du also etwas unter 'Formular' einträgst und du eine Wirkung siehst, dann nutzt du gerade das Formular und nicht die Daten-Editieren-Ansicht der Formular-Daten.
Auch wenn die Daten-Editieren-Ansicht der Formular-Daten ganz ähnlich wie das ursprüngliche Formular ausschaut, ist es nicht 'das Formular'.

Liebe Grüße, Ingmar

:idea: I recommend you the new and up-to-date documentation for Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/en/docs/
Most of this also applies retrospectively to Joomla 3.
Please only ask 1 question per topic :-).

:idea: Ich empfehle Dir die neue und aktuelle Dokumentation für Joomla 4:
docs.joomla-5.visforms.vi-solutions.de/docs/
Das meiste gilt rückwirkend auch für Joomla 3.
Bitte immer nur 1 Frage pro Thema stellen :-).
Last edit: 11 months 6 days ago by Administrator IV.
The following user(s) said Thank You: sestec

Moderators: Administrator AVAdministrator IV
Powered by Kunena Forum