Schnellnavigation:

Kategorien

« Mai 2017»
S M T W T F S
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      

Kopieren Sie diesen Link in Ihren RSS-Reader

RSS 0.91Nachrichten
RSS 2.0Nachrichten

In eigener Sache

Peter Linzenkirchner, Lisardo EDV Beratung in Augsburg. Freelance und Partner für Design- und Webagenturen in Augsburg und München. Pixelgenaue Templates, valides HTML, barrierearm. TYPO3-Projekte, Extension-Programmierung und mehr ... 

Zur Zeit wird gefiltert nach: formular
Filter zurücksetzen

Im Mailformular soll ein Dropdownmenü angeboten werden, mit dessen Hilfe die Zieladresse ausgewählt werden kann. Umsetzung mit der Extension Mailformplus. 

Im Template:

  1. <select name="to">
  2.     <option value="eins"###checked_to_eins###>Eins</option>
  3.     <option value="zwei"###checked_to_zwei###>Zwei</option>
  4.     <option value="drei"###checked_to_drei###>Drei</option>
  5. </select>

Im TypoScript:

  1. plugin.tx_thmailformplus_pi1.default.contact_to=TEXT
  2. plugin.tx_thmailformplus_pi1.default.contact_to.data=GPvar:to
  3. plugin.tx_thmailformplus_pi1.default.contact_to.wrap= |
  4.  
  5. [globalVar=GP:to=eins]
  6.     plugin.tx_thmailformplus_pi1.default.email_to=eins@e-mail.de
  7. [end]
  8. [globalVar=GP:to=zwei]
  9.     plugin.tx_thmailformplus_pi1.default.email_to=zwei@e-mail.de
  10. [end]
  11. [globalVar=GP:to=drei]
  12.     plugin.tx_thmailformplus_pi1.default.email_to=drei@e-mail.de
  13. [end]

Quelle: Deutschsprachige Mailingliste; Beitrag von Fabian Seltmann.

[Update]

Bei Powermail gibt es einen Eintrag hierzu direkt im Manual

 

30August2010

Formulare in Typo3

Mit dem normalen Inhaltselement FORM kann man bereits einiges machen, allerdings hat es einige Einschränkungen:

  • man kann die Formularelemente nur sehr mühsam mehrspaltig anordnen
  • Zwischentexte zwischen den Elementen sind zwar möglich, können aber nur mit einer einheitlichen Formatierung versehen werden.
  • die Validierung erfolgt nur mittels JavaScript
  • der Absender bekommt die gesendeten Inhalte nicht mehr gezeigt.
  • die eingebenen Daten werden nicht in einer Datenbank gespeichert

Es gibt einige Erweiterungen, die das Inhaltselement FORM erweitern, ausserdem kann man Erweiterungen einsetzen, die es komplett ersetzen.

Tipps zu FORM

Einzelne Elemente mit Klassen versehen:

  1. tt_content.mailform.20.params.input = class="mein_input"
  2. tt_content.mailform.20.params.textarea = class="mein-text"

In den Beispielen auf Typo3.org findet sich eine Syntax, wie Kopien an mehrere Empfänger versendet werden können

  1. |recipient_copy=hidden | copy@email.com

und wie man eine Bestätigungs-E-Mail an den Absender schicken kann: 

  1. |auto_respond_msg=hidden|Hello / This is an autoresponse. //We have received your mail.
  2.  

Diese Nachricht wird nur gesendet, wenn die E-Mailadresse bekannt ist, also das Feld “email” ausgefüllt wurde. Unklar ist dabei, inwieweit das gegen Spam geschützt werden kann. Ich vermute, dass es ein neues Feature von Typo3 Vs. 4 ist.

Weiterführende Links:

FORM in css_styled_content

In css_styled_content findet sich ein ziemlich ausführliches TypoScript zum FORM-Objekt, das als Ausgangspunkt genommen werden kann. Es ist dann relativ einfach, dieses zu ergänzen. Nachfolgend zuerst der Code, wie das FORM-Objekt standardmäßig überschrieben wird:

  1. tt_content.mailform = COA
  2. tt_content.mailform.10 = < lib.stdheader
  3. tt_content.mailform.20 = FORM
  4. tt_content.mailform.20 {
  5.   layout = <tr><td class="csc-form-labelcell">###LABEL###</td><td class="csc-form-fieldcell">###FIELD###</td></tr>
  6.   labelWrap.wrap = <p class="csc-form-label">|</p>
  7.   commentWrap.wrap = <p class="csc-form-comment">|</p>
  8.   radioWrap.wrap = <span class="csc-form-radio">|</span><br />
  9.   REQ = 1
  10.   REQ.labelWrap.wrap = <p class="csc-form-label-req">|</p>
  11.   COMMENT.layout = <tr><td colspan="2" class="csc-form-commentcell">###LABEL###</td></tr>
  12.   target = {$styles.content.mailform.target}
  13.   goodMess = {$styles.content.mailform.goodMess}
  14.   badMess = {$styles.content.mailform.badMess}
  15.   redirect.field = pages
  16.   redirect.listNum = 0
  17.   recipient.field = subheader
  18.   data.field = bodytext
  19.   locationData = 1
  20.  
  21.   stdWrap.wrap = <table border="0" cellspacing="1" cellpadding="1" class="csc-mailform">| </table>
  22.   stdWrap {
  23.       editIcons = tt_content: bodytext, pages, subheader
  24.       editIcons.iconTitle.data = LLL:EXT:css_styled_content/pi1/locallang.php:eIcon.form
  25.  
  26.       prefixComment = 2 | Mail form inserted:
  27.   }
  28. }

Danach folgt die neue Version ([compatVersion = 3.9.0]):

  1. tt_content.table.20.innerStdWrap.wrap = |
  2.  
  3. tt_content.mailform.20 {
  4.   accessibility = 1
  5.   noWrapAttr=1
  6.   formName = mailform
  7.   dontMd5FieldNames = 1
  8.   REQ = 1
  9.   layout = <div class="csc-mailform-field">###LABEL### ###FIELD###</div>
  10.   COMMENT.layout = <div class="csc-mailform-label">###LABEL###</div>
  11.   RADIO.layout = <div class="csc-mailform-field">###LABEL### <span class="csc-mailform-radio">###FIELD###</span></div>
  12.   LABEL.layout = <div class="csc-mailform-field">###LABEL### <span class="csc-mailform-label">###FIELD###</span></div>
  13.   labelWrap.wrap = |
  14.   commentWrap.wrap = |
  15.   radioWrap.wrap = |<br />
  16.   REQ.labelWrap.wrap = |
  17.   stdWrap.wrap = <fieldset class="csc-mailform"> | </fieldset>
  18.   params.radio = class="csc-mailform-radio"
  19.   params.check = class="csc-mailform-check"
  20.   params.submit = class="csc-mailform-submit"
  21. }

Das ergibt zum Beispiel folgenden Output:

  1. <form action="Divers.64.0.html" id="mailform" name="mailform" enctype="multipart/form-data" method="post" target="_self" onsubmit="return validateForm('mailform','the_name,Name:,email,Email:','','Leere Pflichtfelder:','')">
  2.   <div style="display:none;">
  3.       <input type="hidden" name="html_enabled" id="mailformhtml_enabled" value="1" />
  4.       <input type="hidden" name="subject" id="mailformsubject" value="This is the subject" />
  5.       <input type="hidden" name="auto_respond_msg" id="mailformauto_respond_msg" value="Hello / This is an autoresponse. //We have received your mail." />
  6.       <input type="hidden" name="tv" id="mailformtv" value="0" />
  7.       <input type="hidden" name="locationData" value="64:tt_content:165" />
  8.   </div>
  9.   <fieldset class="csc-mailform">
  10.       <div class="csc-mailform-field">
  11.           <label for="mailformthe_name">Name:</label>
  12.           <input type="text" name="the_name" id="mailformthe_name" size="20" value="Enter your name here" />
  13.       </div>
  14.       <div class="csc-mailform-label">
  15.           Eine kleine Zwischenzeile
  16.       </div>
  17.       <div class="csc-mailform-field">
  18.           <label for="mailformemail">Email:</label>
  19.           <input type="text" name="email" id="mailformemail" size="20" value="" />
  20.       </div>
  21.       <div class="csc-mailform-field">
  22.           Label <span class="csc-mailform-label">Label value</span>
  23.       </div>
  24.       <div class="csc-mailform-field">
  25.           <label for="mailformtv">Like TV:</label>
  26.           <input type="checkbox" value="1" name="tv" id="mailformtv" class="csc-mailform-check" />
  27.       </div>
  28.       <div class="csc-mailform-field">
  29.           <input type="submit" name="formtype_mail" id="mailformformtype_mail" value="Send this!" class="csc-mailform-submit" />
  30.       </div>
  31.   </fieldset>
  32. </form>

Funktionserweiterungen für FORM

Drei Extensions von Christian Jul Jensen erweitern FORM um einige dieser aufgezählten Funktionen:

  • julle_formpreview: zeigt nach dem Ausfüllen und vor dem Absenden des Formulars nochmals alle Daten.RepositoryManual
  • julle_formreceipt: Damit kann eine Bestätigungsmail an den Ausfüller versendet werden. RepositoryManual
  • julle_form2csv: speichert die Daten im CSV-Format. RepositoryManual
  • formevalwizard: Damit können Validierungsvorgaben gespeichert werden; das macht es für die Redakteure einfacher, komplexe Validierungen einzusetzen, da sie keine regulären Ausdrücke mehr benötigen. Repository,Manual
  • qforms: ein einfach zu nutzender Formulareditor, der den Redakteuren das Anlegen von Formularen erleichtern soll. Repository]=search&no_cache=1&tx;_terfe_pi1[sword]=qforms, Manual

MailformPlus

Diese Extension wird wohl am häufigsten eingesetzt, um FORM zu ersetzen. Die Handhabung ist recht einfache, das eigentliche Formular wird einfach als HTML-Template angelegt, mit den üblichen Platzhaltern. Es ermöglicht somit ein völlig freies Layout. Seine Features:

  • flexibles Layout mit Templates
  • serverseitige Validierung
  • E-Mail an den Absender
  • Speichern in Datenbank und als Export als CSV-Datei
  • Erweiterbar um JavaScript-Validierung, bis hin zu Ajax.
  • ermöglicht mehrseitige Formulare

Nachteil:

  • man kann keine Felder dynamisch vorbelegen
  • komplexere Validierungen (die über »Feld leer« hinausgehen, sind offensichtlich nicht möglich.

RepositoryManual. Eine schöne Beispielseite mit etwas AJAX ist bei Steffen Kamper zu finden.

Mehrsprachigkeit kann mit mailformplus so realisiert werden:

  1. plugin.tx_thmailformplus_pi1.default.email_htmltemplate = /fileadmin/tmpl/deutsch.html
  2. [globalVar = GP:L=1]
  3.   plugin.tx_thmailformplus_pi1.default.email_htmltemplate = /fileadmin/tmpl/andereSprache.html

Mir ist noch dre_formmaker aufgefallen: offensichtlich extrem mächtig, aber neu und noch im Experimentalstadium. Das Manual ist verwirrend, ausserdem erfordert es mindestens PEAR und noch weitere Bibliotheken. Sollte man aber im Auge behalten … RepositoryManual

Kategorien: Extensions  Kommentare 1
Tags: formular, form
Besuchen Sie mich auf Google+